vue 倒计时15分钟

3,477 阅读1分钟

1.需求

使用JavaScript完成指定的日期的倒计时,例如距离投票还有多少时间结束

2算法:

  • 1.使用时间对象的getTime()方法获取所有的毫秒数

  • 2.将指定时间的毫秒数和当前时间的毫秒数相减得到中间相差的毫秒数

  • 3.每一天的毫秒数为:1000*60*60*24 就是1000毫秒*60秒*60分*24小时等于一天的毫秒数

  • 4.倒过来用总的毫秒数除以一天的毫秒数再使用parseInt方法取整就可以得到整天数

  • 5.相处剩下的我们可以使用取余进行得到

  • 6.所以采用的计算规则如下:

    ·整天:总的毫秒数 / 一天的毫秒数

    ·小时:(总的毫秒数 / 一个小时的毫秒数)%24小时(因为整小时部分已经被整天拿走了,相除剩下的就是剩余小时数量,再取余24小时就可以得到剩下多少个小时)

    ·分钟和小时的计算一样,去掉整分钟数,用余下的分钟数 % 60分钟就可以得到剩下的分钟数秒的计算一样

3.上代码

    timeFormat(param) {
      return param < 10 ? '0' + param : param;
    },
    restTime() {
      let that = this
        let interval = setInterval(() => {
          let orderTime = res.createTime
          let setTime = new Date(orderTime)
          let nowTime = new Date()
          let restTime = nowTime.getTime() - setTime.getTime()
          // let hour =  parseInt(restTime/(60*60*1000) % 60)
          let minu = parseInt(restTime / (60 * 1000) % 60)
          let second = parseInt(restTime / 1000 % 60)
          let realmin = 15 - minu
          let realsecond = 60 - second
          let obj = {
            min: that.timeFormat(realmin),
            second: that.timeFormat(realsecond),
          }
          that.countdown = '00:' + obj.min + ':' + obj.second
        }, 1000)
      
    }