<template>
<button @click="getVerificationCode" :disabled="disabled">
<span v-if="sending">获取验证码</span>
<span v-else>{{second}}秒后重发</span>
</button>
<template>
<script>
export default {
data(){
sending: true, //是否发送验证码
disabled: false, //是否禁发验证码
second: 60, //倒计时间
},
methods:{
// 获取验证码
getVerificationCode() {
if (!this.sending)
return;
this.sending = false;
this.disabled = true;
this.timeDown();
},
timeDown() {
let result = setInterval(() => {
--this.second;
if (this.second < 0) {
clearInterval(result);
this.sending = true;
this.disabled = false;
this.second = 60;
}
}, 1000);
},
}
}
</script>
