vue中使用setInterval定时器
应该使用箭头函数,另外记得箭头函数中this指向定时器,所以在定时器之前用const that = this 在箭头函数中使用that指向vuedata() {return {uname: "",pwd: "",phone: "",code: "",sendMsg: "发送验证码",time: 60,disabled: false, //表示按钮是否禁用timer: "", //绑
·
应该使用箭头函数,另外记得箭头函数中this指向定时器,所以在定时器之前用const that = this 在箭头函数中使用that指向vue
data() {
return {
uname: "",
pwd: "",
phone: "",
code: "",
sendMsg: "发送验证码",
time: 60,
disabled: false, //表示按钮是否禁用
timer: "", //绑定定时器
};
},
methods: {
send() {
if (!this.disabled) {
this.sendMsg = this.time + "秒后重新发送";
this.disabled = true;
const that = this;
this.timer = setInterval(() => {
that.timeChange();
}, 1000);
}
},
timeChange() {
//被定时器调用的函数
this.time--;
if (this.time <= 0) {
clearInterval(this.timer);
this.disabled = false;
}
},
checkUp() {},
},
beforeDestroy() {
this.disabled = false; //销毁时清除定时器
},
另外记得在beforeDestroy中清除定时器
参考文章
vue 使用定时器setInterval,且解决不起作用_moon_watermelon的博客-CSDN博客_setinterval不起作用
更多推荐
已为社区贡献1条内容
所有评论(0)