想要實現(xiàn)以下效果

image.png

注意:這里只是秒級倒計時

wxml:

        <view class="end-time">
            <text class="t0">剩余：</text>
            <text class="t1">{{count_down[0]+count_down[1] || 0}}</text>    
            <text class="t0">{{count_down[2]||'天'}}</text>
            <text class="t1">{{count_down[3]+count_down[4] || 0}}</text>
            <text class="t0">:</text>
            <text class="t1">{{count_down[6]+count_down[7] || 0}}</text>
            <text class="t0">:</text>
            <text class="t1">{{count_down[9]+count_down[10]|| 0}}</text>
        </view>

JS:

let timer = null; //這里是生命在page外面
Page({
  data:{
    count_down:"",
  },
 onLoad:function(){
    timer = setInterval(()=>{
        this.date_format( 這里寫到期的日期 )
    } , 1000)
  },
onHide:function(){
    timer && clearInterval(timer)//清楚定時器 防止內(nèi)存泄漏
},
   // 設(shè)置時間
  date_format: function(endTime) {
      var nowTime = new Date().getTime();//現(xiàn)在時間（時間戳）
      var endTime = new Date(endTime).getTime();//結(jié)束時間（時間戳）
      var time = (endTime-nowTime)/1000;//距離結(jié)束的毫秒數(shù)
      // 獲取天屋灌、時洁段、分、秒
      let day = this.fill_zero_prefix(parseInt(time / (60 * 60 * 24)));
      let hr = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) / 3600));
      let min = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) % 3600 / 60));
      let sec = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) % 3600 % 60));
  
      this.setData({
        count_down:day + '天' + hr + ":" + min + ":" + sec
      })  
  },

  // 位數(shù)不足補(bǔ)零
  fill_zero_prefix: function (num) {
    num =  num < 0 ? 0: num;//防止出現(xiàn)負(fù)數(shù)
    return num < 10 ? "0" + num : num //補(bǔ)零操作
  },
})

主要思路:

結(jié)束時間戳 - 當(dāng)前時間 = 可倒計時時間

var nowTime = new Date().getTime();//現(xiàn)在時間（時間戳）
var endTime = new Date(micro_second).getTime();//結(jié)束時間（時間戳）

計算出 天/小時/分/秒 的整數(shù)

let day = this.fill_zero_prefix(parseInt(time / (60 * 60 * 24))); //天
let hr = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) / 3600));//小時
let min = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) % 3600 / 60));//分鐘
let sec = this.fill_zero_prefix(parseInt(time % (60 * 60 * 24) % 3600 % 60));//秒

parseInt 有向下取整的作用  12.34天 => 12天
fill_zero_prefix 只是補(bǔ)零操作
一天的秒數(shù)     =>   (60 * 60 * 24)
一個小時秒數(shù)   =>    3600