微信小程序倒计时

wxml
<view class="count-time_cont">
  <view>{{day}}</view><view>{{hour}}</view><view>{{minute}}</view><view>{{secondsec}}</view></view>
wxss
.count-time_cont {
  display: flex;
}
js
Component({
  properties: {},
  data: {
    gmtDate: '2021-1-15 00:00:00',
    day: 0,
    hour: 0,
    minute: 0,
    secondsec: 0
  },
//组件呗调动的时候运行倒计时 attached: function () {
this.countDown() }, methods: { countDown() { var that = this; var nndate = Date.parse(that.data.gmtDate) let timeLeft = nndate - new Date(); var d, h, m, s, ms; if (timeLeft >= 0) { d = Math.floor(timeLeft / 1000 / 60 / 60 / 24); h = Math.floor(timeLeft / 1000 / 60 / 60 % 24); m = Math.floor(timeLeft / 1000 / 60 % 60); s = Math.floor(timeLeft / 1000 % 60); ms = Math.floor(timeLeft % 1000); ms = ms < 100 ? "0" + ms : ms var str = ms.toString(); ms = str.substr(0, 2); s = s < 10 ? "0" + s : s m = m < 10 ? "0" + m : m h = h < 10 ? "0" + h : h d = d < 10 ? "0" + d : d that.setData({ day: d, hour: h, minute: m, secondsec: s })
  //递归 setTimeout(()
=> { that.countDown() }, 1000); } else { that.setData({ day: '00', hour: '00', minute: '00', secondsec: '00' }) console.log('已截止') } } }, })

 

posted @ 2021-01-12 10:30  web格调  阅读(130)  评论(0编辑  收藏  举报