表单里面嵌套表单的验证方式

话不多说，直接上代码

<el-form
    v-if="drawerVisible"
    ref="editForm"
    :model="editForm"
    :rules="editRules"
    label-width="120px">
    <el-form-item label="姓名:" prop="name">
        <el-input v-model="editForm.name" placeholder="请输入" clearable></el-input>
    </el-form-item>
    <el-form-item label="年龄:" prop="age">
        <el-input v-model="editForm.age" placeholder="请输入" clearable></el-input>
    </el-form-item>
    <el-form-item label="值得注意事项：" prop="items">
         <div v-for="(item, itemIndex) in editForm.items" :key="item.key">
           <el-form :ref="'index'+editForm.items[itemIndex]" :model="editForm.items[itemIndex]" :rules="itemRules" label-width="40px" :inline="true">
              <div class="item-box">
                 <div class="item">
                    <el-form-item label="数量" prop="num" style="width: 14%">
                      <el-input v-model="editForm.items[itemIndex].num" placeholder="请输入">                       </el-input>
                    </el-form-item>
                    <el-form-item label="描述" prop="remark" style="width: 54%">
                       <el-input v-model="editForm.items[itemIndex].remark" placeholder="请输                     入"></el-input>
                    </el-form-item>
                                </div>
                 <div class="item-btn">
                    <el-form-item>
                        <el-button
                            class="el-icon-delete"
                            :disabled="editForm.items.length <= 1"
                            type="text"
                            @click="deleteLine(itemIndex)"
                        >删除</el-button>
                        <el-button
                            v-if="itemIndex === editForm.items.length-1"
                            type="text"
                            icon="el-icon-plus"
                            @click="addLine"
                        >添加行</el-button>
                    </el-form-item>
                </div>
            </div>
        </el-form>
    </div>
  </el-form-item>

<script>
    export default{
        flag: true,
        itemRules: {
            num: [
              {min: 1, max: 5, message: '长度在 1 到 5 个字符', trigger: ['blur', 'change']},
              {
                validator: (rule, value, callback) => {
                        this.$RegExp.formItemValidate(value, 'NUMBER', callback)
                }, trigger: ['blur', 'change']
              }
             ],
            remark: [
              {min: 1, max: 50, message: '长度在 1 到 50 个字符', trigger: ['blur', 'change']},
              {
                validator: (rule, value, callback) => {
                        this.$RegExp.formItemValidate(value, 'REMARK', callback)
                }, trigger: ['blur', 'change']
               }
             ]
        },
        editForm: {
            name: '',
            age: '',
            items: [
                {
                    num: '',
                    fct: '',
                    remark: ''
                }
            ] // 值得注意的事项
         },
    },
    methods:{
      edmitSubmit() {
        // 表单验证 验证成功后执行
        this.$refs.editForm.validate(async (validator) => {
          this.editForm.items.forEach((item, index) => {
           this.$refs[`index${this.editForm.items[index]}`][0].validate(async (validator) => {
               if (!validator) {
                   this.flag = false
                } 
            })
            if (validator && this.flag) {
                //验证通过后的代码
            }
    }


</script>