vue简单的倒计时功能

template部分 

   

      
{{day}}
      
Days
   
   

     
{{hour}}
     
Hours
   
   

     
{{min}}
     
Minutes
    
    

       
{{second}}
       
Seconds
     

scss样式

        ul{
            width: 5rem;
            margin: auto;
            display: flex;
            justify-content: space-between;
            padding-left: 0.38rem;
            li{
                width: 0.9rem;
                color: #fff;
                text-align: center;
                .item{
                    width: 0.9rem;
                    height: 0.8rem;
                    background-image: linear-gradient(to right, #D8D8D8 , #ABEBFF);
                    font-size: 0.48rem;
                    text-align: center;
                    line-height: 0.8rem;
                    font-weight: 600;
                }
                .name{
                    font-size: 0.2rem;
                    padding-top: 0.15rem;
                }
            }
        }

js部分