天天看点

vue rules 表单验证_VUE表单错误验证bug

最近其他部门忙不过来,我们需要新增的后台管理页面没有写,就去写点前端,进入还y遇到一个小bug,百度也没有百度到答案,特地记录下。

前提页面是一个新增页面,有些字段会根据类型显示和隐藏,然后就出现了验证bug,步骤如下,首先第一种默认类型,小标题不是必填的。如下图:

vue rules 表单验证_VUE表单错误验证bug

切换下位置类型,一些字段隐藏,一些字段出现。如下图:

vue rules 表单验证_VUE表单错误验证bug

再切换回来,出现bug,小标题显示必填了。如下图:

vue rules 表单验证_VUE表单错误验证bug

以下内容可能懂前端的更清楚;

管理页面是用vue搭建的,form表单执行加rules,在rules对应的json里面只要有对应字段的必填验证就会在上面显示红色*表示必填。可是我明明没有加这个字段,出现的莫名其妙,最后怎么测试都不能解决,百度上也找不到解决办法,相似的都没有!

在百度过程中找到一个说table错了的,然后加了一个key就解决了,我想我这个应该也是差不多这个原因,于是大胆尝试在小标题上面加了个key。

如下图:

vue rules 表单验证_VUE表单错误验证bug

然后竟然就解决了!

vue rules 表单验证_VUE表单错误验证bug

感觉就是因为用的v-if有些字段有时有有时又没有,但是验证规则都写在一起的,所以导致多次渲染出现了问题。不过我不懂前端,以上只是大胆猜想,希望有懂前端的可以讲讲!

Java程序员日常学习笔记,如理解有误欢迎各位交流讨论!

vue rules 表单验证_VUE表单错误验证bug