公共技巧 封装 获取验证码

HTML代码：

<div 
  class="get-code" 
  v-if="changess" @click.stop="getCode">
    获取验证码
</div>
<div class="get-code"  v-else>{{ second }}S后重试</div>

JS代码：

second: 59, // 获取验证码时的倒计时数字
changess: true, // 控制 获取验证码按钮 或 倒计时 的显示 true为获取验证码按钮 false为倒计时


// 点击获取验证码
getCode() {
  // 在这之前调用接口获取验证码，此操作只是实现倒计时效果
  this.changess = false;
  this.second = 59;
  var interval = setInterval(() => {
     --this.second;
  }, 1000);
  setTimeout(() => {
    clearInterval(interval);
    this.changess = true;
  }, 60000);
},