1. 頁面上

<div class="teleBox">
  <input type="text" class="teleCode" maxlength="4" v-model="teleCode">
  <span class="codeClick" @tap="isClick && gainCode()">{{time}}</span>
</div>

2. data資料

 isClick:  true, // 是否控制獲取驗證碼的點選事件
 time: '獲取驗證碼',

3.methods點選事件

// 獲取驗證碼
    gainCode: function () {
      if(!this.isClick){
        return;
      }
      let flag = this.checkPhoneNum(this.phoneNum); //接受手機號碼校驗的返回值
      let mobile = this.phoneNum;
      if(flag){
        get('/os-wx-bee/sso/captcha.html?mobile='+mobile+'&type=1',{}).then(res => {
          if (res.code === 0) {
            this.isClick = false;
            let times = 60; // 用於倒計時
            this.time = times+'s';
            this.interval = setInterval(() =>{
              times--;
              this.time = times+'s';
              if(times < 0){
                this.time = '重新獲取';
                this.isClick = true;
                clearInterval(this.interval);
              }
            },1000)
          }
        }).catch(err => {
          console.log(err);
        });
      }
    },
 

4 前後臺切換重置倒計時onShow裡面寫

this.isClick = true;
let interval = this.interval;    // 儲存定時器的id
 clearInterval(interval);
 this.time = '獲取驗證碼';