在vue中使用setTimeout,离开当前路由setTimeout未销毁的问题
问题:
从第一个页面跳转到第二个页面后,如果停留在第二个页面,定时器还在运行。如果在两个页面之间来回跳转,跳转时间小于定时器的间隔时间时,也会出现重复创建setTimeout的情况。
原因:
当我们刷新页面时,会将当前页面之前创建的setTimeout以及其他定时器都清除掉,但是仅仅是路由切换是不会清除的。
解决:
具体代码:`
data () {
return {
overtimer: null
}
},
methods: {
stoptime () {
clearTimeout(this.overtimer);
}
},
created () {
this.overtimer = setTimeout(() => {
this.$Message.error('读取卡片超时');
}, 10000)
this.$once('hook:beforeDestroy', () => {
clearInterval(this.overtimer);
this.overtimer = null;
})
}
本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!