ant vue3 form嵌套校验

1、先上效果图

2、核心代码

<a-form ref="formRef" :model="tableInfo" :label-col="{ span: 5 }" :wrapper-col="{ span: 24 }" autocomplete="off">
     <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item label="所属部门" :name="['formState', 'depaId']"
                         :rules="[{ required: true, message: '所属部门不能为空！' }]" :wrapper-col="{ span: 18 }">
              <a-select placeholder="请选择所属部门" v-model:value="tableInfo.formState.depaId" show-search
                        :filter-option="filterOption">
                <a-select-option v-for="(item, index) in tableInfo.deptList" :key="index" :name="item.depaName"
                                 :value="item.depaId">
                  {{ item.depaName }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
 </a-row>
<a-table size="small" :columns="columns" :row-key="record => record.type" :data-source="tableInfo.topData"
                 :pagination="false" bordered>
          <template #bodyCell="{ record, index, column }">
            <template v-if="column.dataIndex === 'defaultAmount'">
              <a-form-item :name="['topData',index,'defaultAmount']"
                           :rules="[{ required: true, message: '默认基数不能为空！' }]">
                <a-input-number v-model:value="record.defaultAmount" class="my-input-number-100" :controls="false" :min="0" :max="999999" 
              </a-form-item>
            </template>
          </template>
        </a-table>
</a-form>

//校验对象定义
const tableInfo = reactive({
  formState: {
    schemeId: null,
    city:[]
  },
  topData: []
});

主要关注a-form-item的:name="['formState', 'depaId']"或:name="['topData',index,'defaultAmount']"，指定校验的对象，如果是数组需要传入下标