Vue-cli框架中计时器学习--制作倒计时

最近学习用到了计时器，因为之前学过js的计时器，有些基础，所以写了一部分，但语法方面有些问题。之后开始查资料，解决问题后记录下。

首先在data数据区域声明一个time值

data () {
  return {
    time: 5
  }
}

在methods方法中构建一个TimeWatch方法

methods: {
    TimeWatch () {
      const interval = window.setInterval(() => {
        //打印每次递归函数打印time值
        console.log(this.time)
        //time值自减
        this.time--
        if (this.time <= 0) {
          window.clearInterval(interval)
        }
      }, 1000)
    }
  }

为window.setInterval对象声明为interval，目的是为了在time值为0的时候，清空自己。否则time值会一直递减，造成内存空间的浪费。

如图为运行结果，每秒打印一个值