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值會一直遞減，造成內存空間的浪費。

如圖爲運行結果，每秒打印一個值