微信小程序(12)--倒计时

时间:2021-08-14 19:47:19

记录一个常见的效果,倒计时。

<text>倒计时:{{content}}</text>
Page({
  /**
   * 页面的初始数据
   */
  data: {
    endTime: '',
    content:''
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that=this;
    that.setData({
      endTime:'1531116473'
    })
    that.countdowm();
  },
  countdowm: function (e) {
    let that = this;
    let timer = setInterval(function () {
      let nowTime = new Date();
      let endTime = new Date(that.data.endTime * 1000);
      let t = endTime.getTime() - nowTime.getTime();
      if (t > 0) {
        let day = Math.floor(t / 86400000);
        let hour = Math.floor((t / 3600000) % 24);
        let min = Math.floor((t / 60000) % 60);
        let sec = Math.floor((t / 1000) % 60);
        hour = hour < 10 ? "0" + hour : hour;
        min = min < 10 ? "0" + min : min;
        sec = sec < 10 ? "0" + sec : sec;
        let format = '';
        if (day > 0) {
          format = `${day}天${hour}时${min}分${sec}秒`;
        }
        if (day <= 0 && hour > 0) {
          format = `${hour}时${min}分${sec}秒`;
        }
        if (day <= 0 && hour <= 0) {
          format = `${min}分${sec}秒`;
        }
        that.setData({
          content: format
        })
      } else {
        clearInterval(timer);
        that.setData({
          content: '结束了!'
        })
      }
    }, 1000);
  }
})