关于使用element表单进行动态表单验证的问题（表单元素显示隐藏）

关于element表单进行动态表单验证的问题

这篇文章主要是对我在使用element表单验证时遇到的一个验证失败的问题总结。

业务：

页面上点击新增时弹出一个对话框，对话框有由form表单和切换按钮构成，打开或关闭切换按钮会隐藏或者展示form表单中的输入框。整个form表单都需要做表单验证，根据切换按钮的的状态改变表单验证规则。

问题

 默认状态下（不改变切换按钮的状态），直接点击提交表单验证是没有任何问题的，但是当你改变了切换按钮状态就会导致表单验证失效。

原因及解决方法

 因为切换按钮状态的改变导致form表单的input的展示和隐藏。页面上是使用v-if来控制input的显示隐藏的，改成v-show即可。ps：至于为什么用v-if会导致表单验证失效我的猜测是因为v-if会改变dom节点，哈哈，这只是猜测。具体为什么希望会有大佬解答下