美文网首页Vue
vue倒计时

vue倒计时

作者: 小虾米前端 | 来源:发表于2018-07-21 17:01 被阅读190次

    根据两个时间戳计算倒计时

    let needDate = endTime -starTime // 计算剩余毫秒值
          var dayDiff = Math.floor(needDate / (24 * 3600 * 1000)) // 计算出相差天数
          var leave1 = needDate % (24 * 3600 * 1000) // 计算天数后剩余的毫秒数
          var dayToHours = dayDiff * 24 // 天数转换成小时
          this.myHours = Math.floor(leave1 / (3600 * 1000)) + dayToHours // 计算出小时数
          // 计算相差分钟数
          var leave2 = leave1 % (3600 * 1000) // 计算小时数后剩余的毫秒数
          this.myMinutes = Math.floor(leave2 / (60 * 1000)) // 计算相差分钟数
          // 计算相差秒数
          var leave3 = leave2 % (60 * 1000) // 计算分钟数后剩余的毫秒数
          this.mySeconds = Math.round(leave3 / 1000)
    

    定时器

    let authTimetimer = setInterval(() => {
            this.mySeconds--
            if (this.mySeconds <= -1) {
              this.myMinutes--
              let setTime = 60
              this.mySeconds = setTime
            }
            if (this.myMinutes <= -1) {
              this.myHours--
              let setMimutes = 60
              this.myMinutes = setMimutes
            }
            if (this.myHours <= -1) {
              clearInterval(authTimetimer)
              let overTime = '00'
              this.myMinutes = overTime
              this.mySeconds = overTime
              this.myHours = overTime
              return this.myMinutes && this.mySeconds && this.myHours
            }
          }, 1000)
    

    相关文章

      网友评论

        本文标题:vue倒计时

        本文链接:https://www.haomeiwen.com/subject/mkuhmftx.html