vue如何做多层循环表单验证？

　　vue怎样做多层循环表单验证？表单验证我们之前也有了解过，这篇主要给大家分享的是使用vue + el-form 实现的多层循环表单验证的内容，实现代码如下，感兴趣的朋友可以参考。
 
　　html
 
　　<el-form :model="formObj" :rules="rules" ref="ruleForm">
　　 <el-form-item :label="'护理记录项目配置：'" label-width="180px">
　　  <template v-for="(formItem, index) in formObj.formDictExtendDoList">
　　   <div class="hljl-container" :key="formItem.id">
　　    <el-row>
　　     <el-col :span="8">
　　      <el-form-item
　　       :label="'字段名称：'"
　　       label-width="90px"
　　       :rules="rules.fieldName"
　　       :prop="'formDictExtendDoList.'+index+'.fieldName'"
　　      >
　　       <el-input
　　        v-model.trim="formItem.fieldName"
　　        type="text"
　　        :clearable="true"
　　        maxLength="100"
　　        placeholder="请输入"
　　       />
　　       <!--@blur="isRepeat(formItem, index, 'fieldName')"-->
　　      </el-form-item>
　　     </el-col>
　　     <template
　　      v-for="(child, index1) in formItem.item"
　　      v-show="formItem.type === 2"
　　     >
　　      <el-col :span="8" :key="child.id">
　　       <el-form-item
　　        :label="'选项' + (index1+1) + '：'"
　　        label-width="90px"
　　        :rules="rules.value"
　　        :prop="'formDictExtendDoList.'+index+'.item.'+index1+'.value'"
　　       >
　　        <el-input
　　         v-model.trim="child.value"
　　         @input="forceUpdate"
　　         :clearable="true"
　　         type="text"
　　         maxlength="20"
　　         placeholder="请输入"
　　        />
　　       </el-form-item>
　　      </el-col>
　　     </template>
　　    </el-row>
　　   </div>
　　  </template>
　　 </el-form-item>
　　</el-form>
　　js
 
　　let _THAT
　　export
　　default {
　　  name: 'formMangeAdd',
　　  data() {
　　    return {
　　      formObj: {
　　        formDictExtendDoList: []
　　      },
　　      rules: {
　　        fieldName: [{
　　          required: true,
　　          message: '请输入',
　　          trigger: 'blur'
　　        }, {
　　          validator: this.itemValidator,
　　          trigger: 'blur'
　　        }],
　　        value: [{
　　          validator: (rule, value, callback) = > {
　　            // I'm a genius.
　　            let that = _THAT
　　            that.forceUpdate()
　　            let field = rule.field
　　            let arr = field.split('.')
　　            let index = +arr[1]
　　            let index1 = +arr[3]
　　            let _value = that.formObj.formDictExtendDoList[index].item[index1].value
　　            if (_value === '' || _value === null || _value === undefined) {
　　              callback(new Error('请输入'))
　　            } else {
　　              callback()
　　            }
　　          },
　　          trigger: 'blur'
　　        }]
　　      }
　　    }
　　  },