vue-element Form表单验证踩坑(表单验证明明有值,却提示错误)

在使用element-UI 的表单时,发生一个验证错误,错误图片先贴出来


输入有值,但报错

代码如下所示:

原绑定


rules规则

绑定都是没有错误的,然后我们利用自定义校验规则验证

使用官网给出的这种形式,将value值打印出来,发现并不能获取到input中的值,显示undefined

最终发现,prop对应的不单单是rules规则里面的验证项,同时对应着我们form-item下的v-model的值。prop绑定的类要与el-form-item下的v-model的值相对应。我们将其做个修改

修改prop


将rules名与prop对应
成功

这样,问题就解决了

你可能感兴趣的:(vue-element Form表单验证踩坑(表单验证明明有值,却提示错误))