使用element-ui +Vue 解决 table 里包含表单验证的问题

应用场景：

在实际使用中经常会遇到需要在Form表单中使用table表格进行表单提交，同时又需要对table的字段进行校验，效果如图所示：

这个校验中，最关键的问题在于如何给el-form-item 动态绑定prop。

:prop="'tableData.' + scope.$index + '.字段名'"

方法一：

上述代码中比较关键的部分有一下两点：

1、:prop="‘domains.'+scope.$index+'.name'" ，用于动态绑定prop到el-form-item；

2、this.$set(this.fromData,‘domains',this.domains) ，用于为fromData设置domains这个节点。

方法二：

补充知识：Vue+ElementUI 完整增删查改验证功能的表格

我就废话不多说了，大家还是直接看代码吧~

 .block{
 width: 75%;
 margin-left: 400px;
 margin-top: 200px;
 }

以上这篇使用element-ui +Vue 解决 table 里包含表单验证的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持考高分网。