vue 点击按钮获取60秒倒计时

html

<div class="button">

<van-button type="info" v-show="show" @click="getCode">获取验证码</van-button>

<van-button type="info" v-show="!show" class="count">{{count}} s</van-button>

</div>

data

return {

show: true,

count: '',

timer: null,

}

js

getCode(){

const TIME_COUNT = 10;

if (!this.timer) {

this.count = TIME_COUNT;

this.show = false;

this.timer = setInterval(() => {

if (this.count > 0 && this.count <= TIME_COUNT) {

this.count--;

} else {

this.show = true;

clearInterval(this.timer);

this.timer = null;

}

}, 1000)

}

}