<template>
<div>
<button :disabled="isDisabled" @click="getIdentifyCodeBtn">
{{ isDisabled ? count + 's后获取' : click }}
</button>
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
count: '59',
click: '获取短信验证码',
isDisabled: false
}
},
methods: {
getIdentifyCodeBtn() {
const TIME_COUNT = 10 //倒计时60秒
if (!this.timer) {
this.count = TIME_COUNT
this.isDisabled = true
this.timer = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--
} else {
this.isDisabled = false
clearInterval(this.timer)
this.timer = null
}
},1000)
}
}
}
}
</script>
10-01
120
02-23
852