Vue:获取验证码按钮倒倒计时效果

 <el-button
            type="primary"
            plain
            @click="getCaptcha"
            :disabled="flag"//点击之后按钮不可获取
          >{{content}}</el-button>
//content显示按钮内文本
data() {
    return {
      // 验证码按钮
      flag: false,//按钮是否可取
      content: "发送验证码",//按钮内文本
      totalTime: 60,//倒计时时间
    };
  },
getCaptcha() {
      this.flag = true;//点击之后设置按钮不可取
      this.content = this.totalTime + "s后重新发送";//按钮内文本
      let clock = window.setInterval(() => {
        this.totalTime--;
        this.content = this.totalTime + "s后重新发送";
        if (this.totalTime < 0) {
          window.clearInterval(clock);
          this.content = "重新发送验证码";
          this.totalTime = 60;
          this.flag = false; //这里重新开启
        }
      }, 1000);
    },
原文地址:https://www.cnblogs.com/xxzb/p/13370622.html