vue3获取验证码并设置倒计时

<div class="input-group mb-3 px-5">
      <span class="input-group-text">验证码</span>
      <input
        type="text"
        v-model="user.password"
        class="form-control"
        aria-label="Amount (to the nearest dollar)"
        required
      />
      <button
        type="button"
        @click="getCode"
        :disabled="isDisposed"
        class="btn btn-primary"
      >
        {{ isDisposed ? `${time}s后重新获取` : "获取验证码" }}
      </button>
    </div>

获取验证码方法:

const getCode = () => {
      if (openTitle.value) {
        alert("请输入正确的手机号");
        return;
      }
      const { username } = user.value;
      console.log("获取验证码", username);
      axios
        .get("auth/register/getverify", { params: { username } })
        .then((res) => {
          console.log("获取验证码结果", res);
          if (res.data.errcode == 0) {
            console.log("验证码发送成功！");
            isDisposed.value = true;
            handleTimeChange();
          } else alert(res.data.msg);
        });
    };

倒计时:

const handleTimeChange = () => {
      if (time.value <= 0) {
        isDisposed.value = false;
        time.value = 60;
      } else {
        setTimeout(() => {
          time.value--;
          handleTimeChange();
        }, 1000);
      }
    };

    const time = ref(60);
    const isDisposed = ref(false);