表单校验之迭代，数组

 

 像这种可以添加的数组表单，该怎么校验呢

<el-row :gutter="12" class="return-detail-row" v-for="(item,i) in form.orderAnjiContactAddDtoList" :key="i">
        <el-col :span="8">
             <el-form-item label="紧急联系人姓名" :prop="`orderAnjiContactAddDtoList[${i}].contactName`" :rules="{required: true, message: '请填写紧急联系人姓名'}">
                        <el-input placeholder="请填写紧急联系人姓名" v-model="item.contactName" clearable/>
             </el-form-item>
      </el-col>
      <el-col :span="8">
             <el-form-item label="紧急联系人电话" :prop="`orderAnjiContactAddDtoList[${i}].mobile`" :rules="contactNameRules">
                   <el-input placeholder="请填写紧急联系人电话" v-model="item.mobile" clearable/>
             </el-form-item>
     </el-col>
     <el-col :span="7">
            <el-form-item label="与申请人关系" :prop="`orderAnjiContactAddDtoList[${i}].relation`" :rules="{required: true, message: '请选择关系'}">
                     <el-select v-model="item.relation" value-key="id"
                               filterable
                               clearable placeholder="请选择关系"
                               size="small">
                              <el-option
                                   v-for="item in dictionaries.ANJI_RELATIONSHIP_WITH_THE_APPLICANT"
                                   :key="item.id"
                                   :label="item.name"
                                   :value="Number(item.code)" />
                     </el-select>
           </el-form-item>
   </el-col>
   <el-col :span="1">
          <el-button type="primary" icon="el-icon-minus" circle size="mini"
               v-if="form.orderAnjiContactAddDtoList.length > 1"
               @click="form.orderAnjiContactAddDtoList.splice(i, 1)" />
  </el-col>
</el-row>

直接用 orderAnjiContactAddDtoList[${i}].mobile 来校验手机号，规则可以写在标签后的rules上，但但多的话可以写到js的data里，比如 contactNameRules

直接在data里定义(vue中)

contactNameRules: [
                { required: true, message: "请输入手机号", trigger: "blur" },
                {
                    validator: function(rule, value, callback) {
                        if (/^(13[0-9]|14[0-9]|15[0-9]|16[6]|18[0-9]|19[6,9]|17[0-9])\d{8}$/i.test(value) == false) {
                            callback(new Error("手机号格式不正确"));
                        } else {
                            //校验通过
                            callback();
                        }
                    },
                    trigger: "blur"
                }
],