发送验证码，读秒

1.结构

当点击时候，触发css中的getsmscode，

<span
   :class="{ getsmscode: true, disable: !codeAvailable }"
    @click="getSmscode">
{{codeAvailable?'发送验证码':countDown+'重发'}} 
</span>

2.定义data数据

data() {
    return {
      loginForm: {
        name: "",
        pass: "",
      },
      spinning: false, // 登录中loading
      rememberPassword: false, // 记住密码
      // 注册登录
      codeAvailable: true,
      countDown: 90,
    };
  },

3.方法

    getSmscode() {
      let that = this;
      if (!this.loginForm.Phone.trim()) {
        return;
      }
      if (this.codeAvailable) {
        this.GetValidateCode(1);
        this.codeAvailable = false;
        this.timer = setInterval(function () {
          that.countDown--;
          if (that.countDown <= 0) {
            that.codeAvailable = true;
            clearInterval(that.timer);
            that.countDown = 90;
          }
        }, 1000);
      } else {
        return false;
      }
    },
    // 验证码
    async GetValidateCode(payload) {
      const Phone = this.loginForm.Phone;
      // 类型 1注册 2登录验证 3重置密码 4修改注册信息
      const params = { Type: payload, Phone };
      const res = await this.$api.GetValidateCode(params);
      if (res.success) {
        this.$message.success(res.msg);
      } else {
        this.$message.warning(res.msg);
      }
    },