isCounting标记计时是否开始,remainTimeTip为显示文本,比如初始值设置为“获取验证码”,clock设置为每1秒自动调用一次,clearInterval(clock)会停止下一次的调用。
data(){return {remainTime:60,//禁用60秒isCounting:false,//是否在计时remainTimeTip:"获取验证码"};
},
....startCountDown(){ if(this.isCounting) return;//计时开始this.isCounting=true;this.remainTimeTip="已发送("+this.remainTime+")";var clock = setInterval(()=>{if(this.remainTime>0){this.remainTime--;this.remainTimeTip="已发送("+this.remainTime+")";}else{clearInterval(clock);this.isCounting=false;this.remainTime=60;this.remainTimeTip="重新发送";}},1000);}
<span @click="startCountDown" >{{remainTimeTip}}</span>