设置获取验证码

<span @click="gainCode()" v-if="showCodeNum">获取验证码</span>
<span @click="againGetCode(timerNum)" v-else>重新获取{{timerNum}}</span></span>

data(){
 return
   timerNum: null, //页面上显示的倒计时
   showCodeNum: true,  //控制显示
}

//获取手机验证码
async gainCode() {
 //调取获取验证码接口
},

//设置倒计时
getCodeNum: function (num) {
  this.showCodeNum = false;
  this.timerNum = num;
  let timer = setInterval(() => {
    this.timerNum--;
  }, 1000);
  setTimeout(() => {
    this.showCodeNum = true;
    clearInterval(timer);
  }, this.timerNum * 1000);
},

//重新获取
againGetCode(){
  if (val === 0) {
    this.gainCode()
  }
},

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

提示： 1000 毫秒= 1 秒。

提示： 如果你只想执行一次可以使用 setTimeout() 方法。