我们都知道,作为浏览器端,如果长时间打开一个定时器不去关掉它,那是非常耗性能的。
通常用到的方式:
data() {
return {
timer: null,
};
},
在mounted()使用定时器
mounted(){
this.timer = setInterval(() => {
console.log(1);
}, 1000);//1s
}
在beforeDestroy()生命周期内清除定时器:
beforeDestroy() {
clearInterval(this.timer);
},
这样写法是没问题,但是当一个页面用多个定时器的时候就会有点卡顿。
解决办法:
在使用setInterval定时器时,通过$once这个事件侦听器来清除定时器
const timer = setInterval(() =>{
// 需要定时运行的内容
}, 1000);
this.$once('hook:beforeDestroy', () => {
clearInterval(timer);
})