vue中的定时器清不掉,vue设置定时器调用方法
本文主要介绍vue如何设置和清理定时器，有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。
目录
设置定时器和清除定时器1。声明要在数据2中设置的定时器的名称。在mounted中创建定时器定时器用法1.vue的完整解决方案是用定时器2代码实现的。
设置定时器和清理定时器
带挂钩功能的清洗定时器失败。
1.在data中声明要设置的定时器名称
data() {
返回{
计时器：空//计时器名称
}
},
2.在mounted中创建定时器
this.timer=(()={
//一些操作
}，5000)复制代码3。页面注销时清除计时器：beforeDestroy() {
clear interval(this . timer)；
this.timer=null
}
然而，鹅没有任何蛋可用。在切换页面之后，预定任务仍然顽强地运行。
销毁前(){
clear interval(this . timer)；
this.timer=null
Console.log(this.timer) //输出为：null，但任务仍在运行。
}
可能我的姿势不对。Shy.jpg在各种论坛中搜索后，发现计时器被$once清零，事件监听器的位置在计时器被定义后：
const timer=setInterval(()={
//一些定时器操作
}, 5000);
//通过$once监听定时器
//触发beforeDestroy挂钩时清除计时器
这个。$once(hook:beforeDestroy ，()={
clearInterval(定时器)；
})
哇，成功了。
定时器的使用全解
1.vue使用定时器
在vue中使用定时器，很多情况下，当你进入和退出vue界面时，并没有清除定时器，导致很多定时器一起工作。这肯定是不能接受的。接下来，您应该在用户进入界面时启动计时器，并在用户离开当前界面时清除计时器。
2代码实现
模板
/模板
脚本
从“@/store”导入商店
从“vue”导入Vue
导出默认值{
名称：“测试”，
data () {
返回{
计时器：空
}
},
方法：{
setTimer() {
if(this.timer==null) {
this.timer=setInterval( ()={
Console.log(开始计时.每秒’)
}, 1000)
}
}
},
已创建：函数(){
this.getFamilyBase_info()
//每次进入界面，先清空之前所有的定时器，然后启动一个新的定时器。
clearInterval(this.timer)
this.timer=null
this.setTimer()
},
已销毁：函数(){
//每次离开当前界面时清除定时器。
clearInterval(this.timer)
this.timer=null
}
}
/脚本
样式范围
/风格
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。