Multiple form validation except last one stuck at Pending state in Vue

I have an Ant Design form with validation <a-from-model> for multiple inputs:

<a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
<a-form-model-item has-feedback label="Git Clone Address(.git)" prop="git_address">
        <a-input v-model="form.git_address" />
      </a-form-model-item>
      <a-form-model-item has-feedback label="Number of Modules" prop="module_number">
      <a-form-model-item label="Notification Lists(seperated by ,)" prop="maillist">
        <a-input v-model="form.maillist" placeholder="johndoe@gmail.com" />
      </a-form-model-item>
      <a-form-model-item has-feedback label="CI/CD Stages" prop="stage">
        <a-checkbox-group v-model="form.stage">
          <a-checkbox value="1" name="stage"> Stage 1 </a-checkbox>
          <a-checkbox value="2" name="stage"> Stage 2 </a-checkbox>
          <a-checkbox value="3" name="stage"> Stage 3 </a-checkbox>
        </a-checkbox-group>
      </a-form-model-item>
      <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
        <a-button type="primary" @click="onSubmit"> Create </a-button>
        <a-button style="margin-left: 10px" @click="onCancel"> Cancel </a-button>
      </a-form-model-item>
    </a-form-model>

Now to submit the form, I need all the validation to pass. This is what export default {data() { looks like:

data() {
    let checkPending;
    let checkModuleNumber = (rule, value, callback) => {
      clearTimeout(checkPending);
      if (!value) {
        return callback(new Error('Please input the number'));
      }
      checkPending = setTimeout(() => {
        if (!Number.isInteger(value)) {
          callback(new Error('Please input digits'));
        } else {
          if (value < 1) {
            callback(new Error('Module number must at least be 1!'));
          } else {
            callback();
          }
        }
      }, 1000);
    };
    let checkGitAddress = (rule, value, callback) => {
      clearTimeout(checkPending);
      checkPending = setTimeout(() => {
        if (!value.endsWith(".git")) {
          callback(new Error("Please enter clone address that ends with .git!"));
        } else {
          callback();
        }
      }, 1000);
    };
    let checkModuleStage = (rule, value, callback) => {
      clearTimeout(checkPending);
      checkPending = setTimeout(() => {
        if (value.some((x) => x === "2") && value.some((x) => x === "3")) {
          callback(
            new Error(
              "You have selected both Stage 1 and Stage 2. Only one can be selected:"
            )
          );
        } else {
          callback();
        }
      }, 1000);
    };

This is what rules looks like:

rules: {
        git_address: [
          { required: true, message: "Please input git address", trigger: "change" },
          { validator: checkGitAddress, trigger: "change" },
        ],
        module_number: [
          { required: true, message: "Please input module number", trigger: "change" },
          { validator: checkModuleNumber, trigger: "change" },
        ],
        maillist: [
          { required: true, message: "Please input maillist", trigger: "change" },
        ],
        stage: [
          {
            type: 'array',
            required: true,
            message: 'Please select at least one stage',
            trigger: 'change',
          },
          { validator: checkModuleStage, trigger: "change" },
        ],
      },

Inside methods I defined the following two functions:

onSubmit() {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          this.display = true;
          alert('submit!');
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    onCancel() {
      this.$refs.ruleForm.resetFields();
    },

The problem I have right now is, whenever I changed the input the validation completes really fast. But when I click the submit button, all checks except the last one stuck at the checkPending state, thus the validation can never be completed. Does anyone know what results in this?Thanks so much!

(My wild guess is because all the check function is async but not sure if it's the case and don't know how to resolve it :(()