v-for循环数组验证

1、rules是每个表单项都要添加

2、注意正常验证表单项是prop，而这里是:prop

3、:prop="‘productGroup.’+index+’.num’"是拼接的形式，前面是v-for绑定的数组，中间是数组索引index，最后是表单项绑定的v-model的名称，然后用点.把它们连接起来。这三项都必须保证正确，错一个都无法验证

4、v-for绑定的数组（phones）也必须绑定在form（ruleForm3）对象里

<!--循环字符串数组-->
<el-form :model="ruleForm3"  >
<el-form-item label="联系人"  
    v-for="(item,index) in ruleForm3.phones" 
    :key="index"
    :prop="'phones.'+index"
    :rules="rules.phone"
    >
  <el-input  v-model="ruleForm3.phones[index]" ></el-input>
</el-form-item>
</el-form>

data() {
    return {
      ruleForm3: {
        phones: ["18280314982",'18083122222']
      },
      rules: {
        phone: [
          { max: 11, message: "请输入正确号码", trigger: "blur"}
        ]
      },
     }
}

<!--循环对象数组-->
<el-form :model="ruleForm3" >
<div  v-for="(item,index) in ruleForm3.phones" :key="index">
    <el-form-item label="联系人"  
        :prop="'phones.'+index+'name'"
        :rules="rules.xx"
        >
      <el-input  v-model="item.name" ></el-input>
    </el-form-item>
    <el-form-item label="年纪"  
        :prop="'phones.'+index+'age'"
        :rules="rules.yy"
        >
      <el-input  v-model="item.age" ></el-input>
    </el-form-item>
</div>

</el-form>

data() {
    return {
      ruleForm3: {
        phones: [
        {name:'18201241111',age:'15'},
        {name:'18201242222',age:'17'}
        ]
      },
      rules: {
        xx: [
          { max:4,message: "请输入正确姓名",trigger: "blur"}
        ],
       yy: [
          { max:3,message: "请输入正确年纪",trigger: "blur"}
        ]
      },
     }
}