vue中使用setInterval#
Copy
this.chatTimer = setInterval(() => { console.log(this.chatTimer); this.chatMsg(); }, 1000);
然后再组件销毁前进行清除
Copy
beforeDestroy() { clearInterval(this.chatTimer); this.chatTimer = null; }
根据 setInterval 返回的 id 打印来看,请除定时器并没有成功
但是这样不行,定时器在局部更新的时候会多次赋值.更改了一种写法,加了一重判断之后依旧无法解决.
Copy
if (!this.chatTimer) { this.chatTimer = setInterval(() => { console.log(this.chatTimer); this.chatMsg(); }, 1000); }
解决#
使用全局变量
Copy
window.chatTimer = setInterval(() => { console.log(window.chatTimer); this.chatMsg(); }, 1000);
Copy
destroyed() { clearInterval(window.liaotianTimer); },
最终解决#
Copy
const chatTimer = setInterval(() => { console.log(chatTimer); this.chatMsg(); }, 1000); this.$once('hook:beforeDestroy', () => { clearInterval(chatTimer); })
分类: Vue