网络编程 
首页 > 网络编程 > 浏览文章

解决vue组件销毁之后计时器继续执行的问题

(编辑:jimmy 日期: 2024/5/17 浏览:3 次 )

直接上代码,以下

window.setTimeout(function(){
 if(this && !this._isDestroyed){ //_isDestroyed 组件是否被销毁
  return;
 }
 window.location.href = "/serverMonitor"+ new Date().getTime();
},5000)

很粗暴的方法,在执行之前看是否被销毁就行,

第二种方法,调用路由组件内的钩子函数beforeRouteLeave

beforeRouteLeave(to,from,next){
clearTimeout(window.timer);
next();
}

补充知识:vue销毁时事件,created和mounted&&activated的区别

我就废话不多说了,大家还是直接看代码吧~

// 关闭当前页面就会销毁监听事件(checkpay)
destroyed() {
 clearInterval(this.checkpay)
}
created()在创建vue对象时,在html渲染之前就触发;但是注意created()只会触发一次; mounted()在html渲染完成之后才会执行的;
 activated()进入当前存在activated()函数的页面时,一进入页面就触发;可用于初始化页面数据等

以上这篇解决vue组件销毁之后计时器继续执行的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

上一篇:详解微信小程序入门从这里出发(登录注册、开发工具、文件及结构介绍)
下一篇:vue 实现setInterval 创建和销毁实例
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网