vue定时器无法清除

Question

vue中设置的定时器无法清除

var count = 1;
this.codeNum = count;
this.timer = setInterval(() => {
  this.codeNum = count++;
  console.log(this.codeNum);
}, 1000);
setTimeout(() => {
  clearInterval(this.timer);
}, 10000);

10秒之后设置的定时器没有清除掉，this.codeNum的值还在一直增长，第一次遇到这种情况，人都疯了，也把this.timer打印到后台了，id值没有变过，但是就是清除不了，哪位大神帮忙看看，鄙人才疏学浅，真是没遇到这种情况😂😂

Answer 1

语法上不存在错误，肯定是漏了一些条件。
果然，运行项目后，找到了问题：

这个语句用的是别的 timer 库（网页不需要），问题是你的 clearInterval 用的又不是这个库里面的，所以清除不了。

（顺带一提，你的项目组织不怎好，页面应该不应该放在 /components 里面，那里是放公共组件的，页面应该放在 /pages 内；布局有点问题，登录框应该有个最小宽度）

Answer 2

请这样写

clearInterval(this.timer); // 新增代码
var count = 1;
this.codeNum = count;
this.timer = setInterval(() => {
  this.codeNum = count++;
  console.log(this.codeNum);
}, 1000);
setTimeout(() => {
  clearInterval(this.timer);
}, 10000);

Answer 3

排查下这段代码是否重复执行了？按这逻辑如多次执行的话，clearInterval只能清掉最后的那个定时器

Answer 4

试了一下 定时器清理掉了
你是不是在其它地方也调用了呢

var count = 1;
var codeNum = count;
var timer = setInterval(() => {
  codeNum = count++;
  console.log(codeNum);
}, 1000);
setTimeout(() => {
  clearInterval(timer);
}, 10000);

Answer 5

Answer 6

Answer 7

clearInterval(this.timer);
this.timer = null;
请重新设置timer以清空内存