解决两个表单切换时验证规则不生效问题

• 需求：页面先展示不可编辑状态的表单信息，点击编辑按钮，表单信息变为可编辑状态，编辑的内容需要通过验证规则。
• 思路：写两个表单，绑定不同的数据，第一个表单用于展示，没有验证规则，第二个表单有验证规则，通过v-if切换
• 问题：第二个表单的验证规则不生效
• 解决办法：给两个表单分别加key值。
• 问题本质：即使两个表单绑定的值不同，但是浏览器在解析时，先解析第一个表单，此时表单上是没有绑定ref，之后再解析第二个表单时，浏览器发现这它的prop和第一个表单的prop一样，所以就认为这两个表单是同一个表单，就没有重新渲染，而ref本身是作为渲染结果被创建的，所以第二个表单没能成功绑定ref，验证就无法生效。

具体代码如下：

    
        
            
                
                    {{ AddCandidateFrom.user_name }}
                
            
            
                
                    {{AddCandidateFrom.apply_position}}