Vue3中element puls里el-form,对象里的数组里的对象，如何进行表单校验

在Vue3中，Element Plus库中的`<el-form>`用于创建复杂的表单组件，并提供了丰富的验证功能。当你需要对嵌套在数组中的复杂对象进行校验，可以采用以下步骤：

1. **设置数据结构**:
首先，确保你的对象数据结构是这样的，每个数组元素都有一个包含验证规则的对象：

   data() {
     return {
       form: {
         items: [
           { field1: '', required: true, validateRules: [{ type: 'string', message: '字段1必填' }] },
           // 其他数组项...
         ],
       },
     };
   }

2. **模板编写**:
在模板中，你可以通过循环遍历数组并动态绑定验证属性，如v-model、v-validate等：

   <el-form :model="form">
     <template v-for="(item, index) in form.items">
       <el-form-item :key="index" :label="`字段${index + 1}`" :rules="item.validateRules">
         <el-input v-model="item.field1"></el-input>
       </el-form-item>
     </template>
   </el-form>

3. **响应式和更新验证**:
更新数组时，可以通过`$set`函数保持数组的响应式，同时更新对应的验证规则。例如，添加新对象时：

   addItem() {
     this.form.items.push({ field1: '' });
   }

4. **提交表单时处理验证结果**:
使用`validate`方法触发整个表单的验证，然后根据返回的结果处理（比如阻止提交、提示错误信息）：

   handleSubmit() {
     if (this.$refs.form.validate()) {
       // 表单验证通过，进行下一步操作
     } else {
       console.log('表单有误');
     }
   }