element form表单组件重复错误提示不显示

前言

在我司已经经历了好几个后台项目了，登录页面一直有个小问题，如果登录出错了并且第一次提示了错误，然后再点击同一个按钮，错误提示就消失，而不是重复显示同一个错误。

后来去翻了下element的源码，发现el-form-item的error属性监听的是watch方法，也就是两次重复的错误操作，提示的错误信息一致，就不会触发watch方法。而我的逻辑是这样的，每次点击登录或者发送验证码，都会去重新验证表单，验证通过了才会去发登录或者验证码请求。但是Element表单组件规定一旦表单验证通过就会清除原来的错误提示信息，这样就导致了第二次点击登录或者发送验证码，原来的错误信息被清除了，而两次错误信息又一致没法触发watch方法，所以也不会重新渲染出新的错误信息出来。

感觉说得很啰嗦，不过造成的原因应该还是表达清楚了。

解决的方法

1. 避免form validate和error一起使用，要么自己写if判断做表单为空和输入不合法的字段，使用error提示错误信息。要么就不要使用了form validate就不要使用error

2. 使用vue $nextTick来修复这个问题
   vm.$nextTick可以将回调延迟到下次 DOM更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM 更新。
   我们知道错误提示不显示的根本原因是watch方法没有被触发。那如果我每次给错误赋值一个随机值，然后使用vue