解决vue组件销毁之后计时器继续执行的问题
更新时间：2020年07月21日 10:51:43 作者：淵波太郎
这篇文章主要介绍了解决vue组件销毁之后计时器继续执行的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
直接上代码，以下
window.setTimeout(function(){
if(this && !this._isDestroyed){ //_isDestroyed 组件是否被销毁
return;
}
window.location.href = "/serverMonitor?t="+ 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架构插槽slot使用教程示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-02-02
这篇文章主要介绍了vue加载视频流,实现直播功能的过程，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本篇是我对vue使用过程中以及对一些社区朋友提问我的问题中做的一些总结，感兴趣的朋友跟随脚本之家小编一起学习吧2018-02-02
useAsyncState 是 VueUse 库中提供的一个实用工具,它用于处理异步状态,本文主要介绍了VueUse中useAsyncState的实现及其原理,具有一定的参考价值,感兴趣的可以了解一下2024-08-08
这篇文章主要介绍了Vue3中watch的详解,主要包括Vue2使用watch及Vue3使用watch的方法，通过多种情况实例代码相结合给大家详细讲解，需要的朋友可以参考下2022-11-11
微信、支付宝支付密码时的密码输入框大家都很熟悉，本文主要介绍了vue3如何实现6位支付密码输入框，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-04-04
这篇文章主要为大家详细介绍了Vue移动端实现pdf/excel/图片在线预览功能的相关方法,文中的示例代码讲解详细,有需要的小伙伴可以参考下2024-04-04
其实很多公司都会有类似于用户权限树的增删改查功能，本文主要介绍了vue实现树形结构增删改查，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
本文介绍了如何以Vue引入antDesignUI,主要包括下载安装、配置和引入组件等步骤,通过本文,读者可以快速了解antDesignUI在Vue中的应用,感兴趣的可以了解一下2023-08-08
如何解决Element-ui的el-table固定列后出现的表格错位问题
这篇文章主要介绍了如何解决Element-ui的el-table固定列后出现的表格错位问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-09-09
最新评论