方法一:
在data函數中定義定時器名稱:
data(){
return {
timer: null // 定時器名稱
}
}
然后這樣使用定時器:
this.timer = (()=>{
// To do something
}, 1000)
最后在beforeDestroy()
生命周期內清除定時器:
beforeDestroy() {
clearInterval(this.timer);
this.timer = null;
}
方案1有兩點不好的地方乞娄,引用尤大的話來說就是:
- 它需要在這個組件實例中保存這個 timer,如果可以的話最好只有生命周期鉤子可以訪問到它锡凝。這并不算嚴重的問題挟秤,但是它可以被視為雜物壹哺。
- 我們的建立代碼獨立于我們的清理代碼开缎,這使得我們比較難于程序化的清理我們建立的所有東西割去。
方法二
該方法是通過$once這個事件偵聽器器在定義完定時器之后的位置來清除定時器尔当。以下是完整代碼:
const timer = setInterval(() =>{
// 某些定時器操作
}, 500);
// 通過$once來監(jiān)聽定時器蕉斜,在beforeDestroy鉤子可以被清除论熙。
this.$once('hook:beforeDestroy', () => {
clearInterval(timer);
})