simple count down handler for vue.js

App.vue

<script>
// 未来的终止时间 2018.10.10 23:59:59
const futureDate = new Date(2018, 10, 10, 23, 59, 59)

export default {
  data () {
    return {
      time: {
        day: '69', // String
        hour: '59', // String
        minute: '59', // String
        seconds: '59' // String
      }
    }
  },
  mounted () {
    this.countDownComputer() // 初始化倒计时
    this.countDownMachine() // 开始倒计时
  },
  methods: {
    addZero: num => num.toString().length === 1 ? `0${num}` : num,
    formateCountDown () {
      const time = this.time
      return `${time.day} 天 ${time.hour} 时 ${time.minute} 分 ${time.seconds} 秒`
    },
    // 倒计时计算器
    countDownComputer () {
      let nowTime = Date.now()
      const secondMinuend = 1000
      const minMinuend = 1000 * 60
      const hourMinuend = 1000 * 60 * 60
      const dayMinuend = 1000 * 60 * 60 * 24
      let countDownSeconds = futureDate - nowTime
      const day = (countDownSeconds / dayMinuend).toFixed()
      const hour = (countDownSeconds % dayMinuend / hourMinuend).toFixed()
      const minute = (countDownSeconds % dayMinuend % hourMinuend / minMinuend).toFixed()
      const seconds = (countDownSeconds % dayMinuend % hourMinuend % minMinuend / secondMinuend).toFixed()
      if (day !== this.time.day) this.time.day = this.addZero(day)
      if (hour !== this.time.hour) this.time.hour = this.addZero(hour)
      if (minute !== this.time.minute) this.time.minute = this.addZero(minute)
      if (seconds !== this.time.seconds) this.time.seconds = this.addZero(seconds)
    },
    // 倒计时启动器
    countDownMachine () {
      const vm = this
      const perMinute = 1000
      setInterval(() => vm.countDownComputer(), perMinute)
    }
  }
}
</script>

一段倒计时代码，用在任何你用得到的地方。

function formatTime(ms) {
  const secondMinuend = 1000
  const minMinuend = 60 * secondMinuend
  const hourMinuend = 60 * minMinuend
  const dayMinuend = 24 * hourMinuend
  const day = Math.floor(ms / dayMinuend)
  const hour = Math.floor(ms % dayMinuend / hourMinuend)
  const minute = Math.floor(ms % dayMinuend % hourMinuend / minMinuend)
  const seconds = Math.floor(ms % dayMinuend % hourMinuend % minMinuend / secondMinuend)
  return {
    day: addZero(day),
    hour: addZero(hour),
    minute: addZero(minute),
    seconds: addZero(seconds)
  }
}

function countDownComputer() {
  let nowTime = Date.now()
  let countDownSeconds = futureDate - nowTime
  const time = formatTime(countDownSeconds)
  if (time.day !== this.time.day) this.time.day = time.day
  if (time.hour !== this.time.hour) this.time.hour = time.hour
  if (time.minute !== this.time.minute) this.time.minute = time.minute
  if (time.seconds !== this.time.seconds) this.time.seconds = time.seconds
}