vue 嵌套表格组件_vue elementUI 二次封装动态增减可编辑的表格，并获取子组件校验结果（双重校验）...

场景：在项目的开发过程中，经常使用到表单中嵌套着可编辑的表格，这个时候就需要表单的双重校验。

本文栗子为二次封装动态增减的可编辑表格，并实现表表单的双重校验

ps:由于实现的数据比较多，当前栗子为比较脱敏的，省略了一些字段，换汤不换药。

子组件 variableList.vue

ref="variableListForm"

:model="formData"

>

v-show="formData.variableList.length"

:data="formData.variableList"

border

style="width: 100%"

class="form-item-content variable_tabel"

>

label="id"

class="table-item variable-item-id variable-id"

>

:prop="`variableList.${scope.$index}.id`"

:rules="variableRules.id"

>

label="name"

class="table-item variable-item-name variable-name"

>

:prop="`variableList.${scope.$index}.name`"

:rules="variableRules.name"

>

:label="variableLabels.operator"

class="table-item variable-item-operator variable-o