el-form中数组嵌套对象的验证

最近在遇到的问题，在el-form里有一个嵌套对象的数组，要对数组里的对象的各个属性进行验证，直接在rules里写属性名是不行的需要在el-form的结构和eules都做一下处理，这里附上我解决问题之后写的demo代码。

这里是页面结构

el-form中有数组内嵌对象，对内嵌对象内的属性做校验

```vue
el-form-item可单独设置label-width设置后覆盖form上设置的统一的label-width
<el-form :model="formData" :rule="rules" label-width="0">
    <el-form-item>
    <input v-model="formData.brand" />
    </el-form-item>
//这里是数组的数据，我的是可以新增的数组，一样适用这种处理
<div v-for="(item,index) in formData.phones" :key="index" >
//prop绑定
    <el-form-item :prop=`phones[${index}].name`
//rules定义好之后，一定要在这里引入一下
    :rules="rules.productGroupRules.name">
    <input v-model="item.name" />
    </el-form-item> 
      <el-form-item :prop=`phones[${index}].type`
       :rules="rules.productGroupRules.type">
    <input v-model="item.type" />
    </el-form-item>
</div>
</el-form>

这里是form数据和rules

 formData:{
                brand:'华为',
                phones:[{name:'华为mate40'type:'Mate40 5G'},
                       {{name:'华为mate30'type:'Mate30 5G'}]
            },
                rules:{
                    brand:[{required,message:'11111'}],
                    //这里是数组的rules设置
                    productGroupRules{
                    name:[{required,message:'name不为空'}],
                    type:[{required，message:'type不为空'}]
                    }
                }
        }