<template>

<el-form ref="formRef" :model="formData" :rules="formRules">

    <el-form-item label="身份证号" prop="idCard">

         <el-input v-model="formData.idCard" @blur="getDetail()" ></el-input>

   </el-form-item>

   <el-form-item label="年龄" prop="age">

        <el-input v-model.number="formData.age"></el-input>

   </el-form-item>

</el-form>

</template>

比如我想验证了身份证号符合规范之后才去执行某个函数。执行getDetail的时候必须是验证了身份证号的该怎么做呢？

import { ref } from 'vue';

// 获取表单实例的 ref

const formRef = ref(null);

// 表单数据对象

const formData = ref({ idCard: '', age: null });

const formRules= reactive({
  idCard: [{required: true,  validator: checkIdCard}],
  age:[{required:true,message:'请输入年龄'}]
});

//身份证的校验
const checkIdCard=(rule: any, value: any, callback: any)=>{
  const regexp=/^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i;
  if(value===""||value===undefined) callback("请输入身份证号");
if (!regexp.test(value)) {
   callback(new Error("请输入正确的身份证号"));
} else {
  return callback()
}
}

//根据身份证查询评估结果
const getDetail = async () => {
  ruleFormRef.value!.validateField('idCard', async(valid) => {
    if (valid) {
      // 验证通过，执行其他函数

          } else { //验证未通过  

        }