Vue+表单验证 VeeValidate 实践
为什么需要用表单验证插件,想想自己重写过几次表单验证,重复造轮子相当的痛苦,当然你可以自己造一套通用的组件。我比较懒,表单验证就用现成的,VeeValidate 可扩展性也不错,所以就使用它来做表单验证。 jquery.validate 也是不错的选择,这是后话了,本文就只介绍 VeeValidate 在 Vue 中的实践。 官网: https://baianat.github.io/vee-validate/ 基本示例(官方说明) 您所需要的只是将 v-validate 指令添加到要验证的输入中,并确保您的输入具有 name 用于生成错误消息的属性。 然后,传递给指令一个 rules 字符串,其中包含由管道' | ' 分隔的验证规则列表。对于以下示例,验证规则很简单。使用 required 表明,该领域是必需的, email 以表明该字段必须为电子邮件。要结合这两个规则,我们指定字符串值 required|email 的 v-validate 表达式的值。 <input v-validate="'required|email'" name="email" type="text"> 要显示错误消息,我们只需使用该 errors.first 方法来获取为该字段生成的第一个错误: <span>{{ errors.first('email') }}</span> 1、安装(个人博客说明)