vue js 禁用控件一分钟，并显示倒计时

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);
	  }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<span @click="startCountDown" >{{remainTimeTip}}span>
1