表单嵌套的校验,以elementUi的form表单为例

 情景描述:

       最近的项目中遇到的一个场景, 需要在表单中再嵌套两个表单,并且在点击提交按钮的时候进行三个表单的校验

最初做法:

       开始的时候没有想明白,就直接在表单里面又写了两个表单,然后各种的调样式让布局好看一些.

其中也有一些相关联的,结果下拉项一旦change就会触发校验,但是就违背了我的点击按钮的触发校验,调整了很久都没办法改过来.

最终做法:

      最后发现html部分写法有问题.于是乎进行了修改--------> 将被嵌套的两个表单,作为外层form表单的el-form-item项.再在item项中写嵌套的form表单

      注意:  外层和嵌套的表单都需要在提交按钮的时候进行校验.所以绑定的时候要注意.嵌套的表单是作为外层表单的一个对象哦~ 且prop和v-model的name要保持一直.

---------------------------------------------------------------记录日常的一次犯错---------------------------------------