第一步
data() {
return {
disableCode: false,
getCode: this.$t('login.obtaining'), // 按钮显示的内容
isGeting: false,
count: 60
}
},
第二步
<el-button
class="validateImg"
type="primary"
:disabled="disableCode"
:class="{ codeGeting:isGeting }"
@click.stop="getVerifyCode"
>{{ getCode }}</el-button>
第三步
// 点击按钮倒计时
getVerifyCode() {
var countDown = setInterval(() => {
if (this.count < 1) {
this.isGeting = false
this.disableCode = false
this.getCode = this.$t('login.obtaining')
this.count = 60
clearInterval(countDown)
} else {
this.isGeting = true
this.disableCode = true
this.getCode = this.count-- + 's' + this.$t('login.resend')
}
}, 1000)
},