简单的elementui倒计时按钮事件

html部分

  <el-button :disabled="disableButton" style="width:35%; float: right;" @click="startCountdown">
                <span>{{ buttonText }}</span>
              </el-button>

初始化:

      disableButton: false,
      buttonText: '获取验证码',
      countdown: 60

方法:

methods: {
    // 验证码发送倒计时
    startCountdown() {
      this.disableButton = true;
      this.buttonText = `${this.countdown}秒后再试`;
 
      const timer = setInterval(() => {
        this.countdown--;
        this.buttonText = `${this.countdown}秒后再试`;
 
        if (this.countdown === 0) {
          clearInterval(timer);
          this.disableButton = false;
          this.buttonText = '获取验证码';
          this.countdown = 60;
        }
      }, 1000);
    }
}