vue中将秒数转化为天时分秒,并倒计时,代码如下:

export default {
  data () {
    return {
      countTime: 129600,
      _interval: '',
      toLiveBtn: '计时点击事件'
    }
  },
  methods: {
     // 倒计时事件
      countdown() {
        const that = this
        that._interval = setInterval(() => {
          if(that.countTime == 0) {
              // 计时结束,清除缓存
              clearInterval(that._interval)
            } else {
              that.countTime--
              let day = parseInt(that.countTime / 60 / 60 / 24)
              let hr = parseInt(that.countTime / 60 / 60 % 24)
              let min = parseInt(that.countTime / 60 % 60)
              let sec = parseInt(that.countTime % 60)

              day = day > 9 ? day : '0' + day
              hr = hr > 9 ? hr : '0' + hr
              min = min > 9 ? min : '0' + min
              sec = sec > 9 ? sec : '0' + sec
              that.toLiveBtn = `${day}${hr}${min}${sec}秒`
            }
        }, 1000);
      }
  },
  //当离开页面时,清除倒计时
  beforeDestroy() {
    clearInterval(this._interval)
  }
}
Logo

前往低代码交流专区

更多推荐