vue框架中的计时器实现

//div部分

< div class= "recend-code" >

< button class= "resend-button" :class="{ 'can-click' :canClick, 'cant-click' :cantClick}" @click=" countDown" >{{ content}} </ button >

</ div >

//script部分

//重新获取验证码倒计时功能

countDown() {

if (! this. canClick) return;

this. canClick = false;

this. cantClick = true;

this. content = "重新发送（" + this. totalTime + "s）";

let clock = window. setInterval(() => {

this. totalTime--;

this. content = "重新发送（" + this. totalTime + "s）";

if ( this. totalTime < 0) {

window. clearInterval( clock);

this. content = "重新发送";

this. totalTime = 10;

this. canClick = true;

}

}, 1000);