类似上方动态渲染的表单校验，如何操作

代码如下：

<div class="contract-card-wrapper">
        <el-row v-if="agreementList.length > 0 && radio === 2" :gutter="20">
          <el-col v-for="(item, index) in agreementList" :key="index" :span="12">
            <ContractCard :ref="(el) => setItemRef(el, index, 1)" :form-data="item" @remove="remove(index, 'kj')"> </ContractCard>
          </el-col>
        </el-row>
      </div>


const agreementList = ref<any[]>([])
const singleContractList = ref<any[]>([])
const contractCardRefs = [] as any[]
const contractCardRefs2 = [] as any[]
// 核心，动态设置ref
const setItemRef = (el: any, index: number, type: number) => {
  if (!contractCardRefs[index] && el && type === 1) {
    contractCardRefs[index] = el
  }
  if (!contractCardRefs2[index] && el && type === 2) {
    contractCardRefs2[index] = el
  }
}

// 使用Promise.all 联合校验
const Refs = [...contractCardRefs, ...contractCardRefs2]
  Promise.all(Refs.map((x) => x.formRef.validate())).then((res) => {
    if (!res.every((a) => a)) {
      return ElMessage.error("请检查表单是否填写完整")
    }