当我们的数据是v-for循环出来的,要想表单验证生效,可就没那么简单了,下面一起来看看实现方式吧!
常见报错:please transfer a valid prop path to form item
1.普通的表单验证
一般情况下,只要我们的prop里面的值和v-model中的值一一对应,表单验证变会生效,如下例子所示:
2.循环出来的input框进行表单验证
但是有时候会出现表单中的input框是动态增加或删除的,这时候该怎么实现表单验证呢?
A.修改prop值
主要是prop值,prop中的第一个值要为遍历数据中的other,中间拼接索引,然后拼接v-model中的值,如下例子所示:
:prop=" 'other.' + index + '.otherCharges' 注意这个小数点一定不能楼掉,漏掉就会报如下的错
please transfer a valid prop path to form item
B.单独为当前数据添加表单验证
还有要注意的就是表单验证的rules要写在当前验证的那个<el-form-item>内,否则无法生效