(1)HTML代码
- 使用element-ui
<el-button @click="accessVerify">{{ btn }}</el-button>
(2)Js代码
data() {
return {
btn: "获取验证码",
disabled: false,
plain: false,
timer: null,
count: ""
};
},
//获取短信验证
accessVerify() {
this.btn = "重新发送(60)";
//计时器
this.codeInterval();
},
//重新获取验证码倒计时
codeInterval() {
const TIME_COUNT = 59;
if (!this.timer) {
this.count = TIME_COUNT;
this.timer = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.btn = "重新发送(" + this.count-- + ")";
} else {
clearInterval(this.timer);
this.timer = null;
this.disabled = false;
this.plain = false;
this.btn = "获取验证码";
}
}, 1000);
}
}
- 直接复制即可使用