Ant Design Vue表单校验数组类型数据

1. 定义数据 及表单结构

const form = ref({
    dynamicValidateForm: [{
      aas: '', nums: ''
    }]
});


<a-form
	:model="form"
	:rules="rules"
	ref="formRef"
	name="mp_form"
	:label-col="{ span: 5 }"
	:wrapper-col="{ span: 19 }"
>
    <a-space
		v-for="(sight, index) in form.dynamicValidateForm"
		:key="index"
		style="margin-bottom: 8px; margin-left: 50px; width: 500px"
		align="baseline"
	>
        <a-form-item
			style="width: 600px"
			:label="index == 0 ? '产品配置列表' : ''"
			:style="{ marginLeft: index == 0 ? '0px' : '125px' }"
            :rules="{ required: true, message: '请选择产品配置', trigger: ['change',             
            'blur'] }"
            :name="['dynamicValidateForm', index, 'aas']"
	    >
			<a-select v-model:value="sight.aas" @change="sightChange">
				<a-select-option
					:value="item.id"
					v-for="(item, index) in arr"
					:key="item.id"
					:disabled="item.disabled && (sight.aas != item.id || !sight.aas)"
				>{{ item.name }}</a-select-option>
			</a-select>
		</a-form-item>
        <a-form-item
          style="width: 600px"
          :style="{ marginLeft: '125px' }"
          :rules="{ required: true, message: '请输入产品配置', trigger: ['change',         
          'blur']}"
          :name="['dynamicValidateForm', index, 'nums']"
        >
          <a-input v-model:value="sight.nums" />
        </a-form-item>
    </a-space>
</a-form>

2. 提交时进行校验即可

async handleSubmit() {
    try {
        await (formRef.value as any).validate()
        ...   
    } catch {}
}