<div class="form">
            <button class="send_btn" :class="!login.canGet ? 'btn-disabled' : ''"
              @click="getCode"
              :disabled="!login.canGet"
              type="button">
              <span v-show="!login.canGet">{{login.waitTime+"s"}}後重發</span>
              <
 
span v-show="login.canGet">{{tempLogin.text}}</span>
            </button>
          </div>

data () {
    return {
      tempLogin: { // 定義一個臨時物件
        canGet: true,
        timer: null,
        waitTime: 60,
        text: '傳送驗證碼'
      }
    }
  },
computed: {
    login () { // 最終物件
 

      const _this = this
      if (!this.tempLogin.canGet) {
        if (this.tempLogin.waitTime === 0) {
          _this.tempLogin.text = '重新發送'
        }
        return this.timeCountdown(this.tempLogin)
      } else {
        return this.tempLogin
      }
    },
  },
methods: {
  /* 傳送驗證碼 */
    getCode () {
      
 
// 請求介面開始，成功之後呼叫
      // 倒計時開始
      this.timeCountdown(this.login) // 引數為最終物件
    },
    timeCountdown (obj) {
      // obj包括timer、waitTime 、canGet
      const TIME_COUNT = 60 // 預設倒計時秒數
      if (!obj.timer) {
        obj.waitTime = TIME_COUNT
        obj.canGet = false
        obj.timer = setInterval(() => {
          if (obj.waitTime > 0 && obj.waitTime <= TIME_COUNT) {
            obj.waitTime--
          } else {
            obj.canGet = true
            clearInterval(obj.timer) // 清空定時器
            obj.timer = null
          }
        }, 1000)
      }
      return {
        timer: obj.timer,
        canGet: obj.canGet,
        waitTime: obj.waitTime
      }
    }  
}