vee-validate是Vue.js的轻量级插件，可让您验证输入字段并显示错误。

安装和下载：

// for vue 1.x
npm install vee-validate --save

// for vue 2.x
npm install vee-validate@next --save

入门

安装您将在应用程序中使用的规则，我们现在将安装required规则：

import { extend } from 'vee-validate';
import { required } from 'vee-validate/dist/rules';

// 添加所需的规则
extend('required', {
  ...required,
  message: 'This field is required'
});

导入ValidationProvider组件并注册：

全局注册

import { ValidationProvider } from 'vee-validate';

// 全局注册
// main.js 或任何入口文件。
Vue.component('ValidationProvider', ValidationProvider);

本地注册

import { ValidationProvider } from 'vee-validate';

export default {
  components: {
    ValidationProvider
  }
};

所有的JavaScript工作都已完成。接下来，在模板中添加要验证它们的输入：

<ValidationProvider name="email" rules="required|email">
  <div slot-scope="{ errors }">
    <input v-model="email">
    <p>{{ errors[0] }}</p>
  </div>
</ValidationProvider>

变更日志：

v4.4.8 (07/21/2021)

• 修复了在使用 v-model 且未指定 uncheckedValue 时将缺失值符号发送到绑定模型的复选框

v4.4.7 (07/20/2021)

• Bug修复

v4.4.6 (07/08/2021)

• Bug修复

v4.4.5 (06/14/2021)

• 固定的空初始值不被尊重

v4.4.4 (06/06/2021)

• 已修复：应在注册时验证具有注册前架构错误的字段

v4.4.3 (06/02/2021)

• 使用具有全局规则的表单模式时，在 <Field /> 组件中忽略了固定的保释选项

v4.4.2 (05/29/2021)

• 清理与另一个字段交换名称的表单值字段

v4.4.1（05/24/2021）

• 在错误删除的表单验证结果上带回错误对象

v4.4.0（05/24/2021）

• 修复了URL规则未导出的问题
• 修复了绑定到未定义时Field组件不发出onUpdate：modelValue的问题

v4.3.6（05/09/2021）

• 添加了一种新方法来检测是否 modelValue 作为道具传递

v4.3.5（05/02/2021）

• 错误修正：优先级自我注射超过父级注射的时间

v4.3.4（04/26/2021）

• 确保该 valid 标志正确更新，而不考虑验证意图

v4.3.3（04/22/2021）

• 提交通过<Form /> 或 handleSubmit 或 submitForm 功能呈现的表单 ，所有字段将自动被“触摸”

v4.3.2（04/21/2021）

• 修复了将初始值包装在ref中的问题，该问题导致了单个resetField调用和脏字段级标志的某些问题

v4.3.1（04/18/2021）

• 在ErrorMessage组件ctor选项中添加了名称，这将使其在Vue开发工具中可识别
• 使用Field，Form，ErrorMessage组件调整了自定义组件的插槽渲染，在某些情况下避免了Vue警告

v4.3.0（04/08/2021）

• 计算验证模式支持：以前，特别是在使用yup模式时，很难仅使用Yup.mixed和Yup.when API创建动态模式，现在您可以创建计算模式以使其更容易实现。
• v-model.number修饰符支持：TheField组件v-model现在支持.number修饰符。
• 新的全局规则：感谢@davidguilherme，他将url规则添加回了全局验证器。
• 对ja语言环境的一些增强。

v4.2.4（03/25/2021）

• 修复了以下问题：useField 即使 validateOnValueChange 设置为 ，验证也会在值更改时触发 false

v4.2.3（03/22/2021）

• Bug修复

v4.2.2（03/04/2021）

• 修复了要通过以下方式卸载字段/表单的待定验证的问题 vue-router
• 添加了维吾尔语地区

v4.2.1（02/27/2021）

• 修复了4.2.1中引入的一些问题

v4.2.0（02/24/2021）

• 更新和错误修正

v4.1.20（02/24/2021）

• 修复嵌套错误
• 修复了复选框的初始值会导致输出格式错误的问题

v4.1.19（02/16/2021）

• 发布了一个新的配套程序包@vee-validate/zod ，该程序包 允许vee-validate使用Zod来执行字段级和表单级架构验证，  以替代yup

v4.1.18（02/11/2021）

• 修复了由于竞争条件而将字段值切换为共享相同名称的另一个字段后将其设置为空白的问题

v4.1.17（02/09/2021）

• 添加了回退事件对象检测，以防处理程序接收到非标准 window.Event 实例

v4.1.16（02/08/2021）

• 修复了全局规则在被另一个字段作为目标时无法解决嵌套字段值的问题

v4.1.14（02/06/2021）

• 修复了以下问题：具有包含跨字段验证的全局规则的字段将忽略验证触发器

v4.1.13（02/06/2021）

• 添加了bn语言环境

v4.1.12（01/27/2021）

• 修复了删除前一项时阵列中的无线电字段无法正确切换其值的问题

v4.1.11（01/19/2021）

•  插槽属性和  返回值validateField 上的公开 函数 ，以前只能用作可组合的辅助函数。<Form />useForm

v4.1.10（01/17/2021）

• 修复了以下问题：如果添加了另一个项目并且尚未对其进行操作，则数组字段不会保留其状态

v4.1.9（01/13/2021）

• 更新了类型以使用 yup 自己的类型信息，并增强了泛型useForm 和 object 模式之间的兼容性 

v4.1.8（01/13/2021）

• 更改 <ErrorMessage />为在没有相关字段的消息时不呈现任何内容

v4.1.7（01/12/2021）

• 公开了两种提交类型：  SubmissionContext， SubmissionHandler

v4.1.6（01/10/2021）

• onSubmit 在Form 组件上添加了prop， 并添加了 emits 选项以允许模板与Typescript一起正常工作。

v4.1.5（01/05/2021）

• 修复了由4.1.4 发行版引起的v-model 未正确设置初始值 的问题 。

v4.1.4（20年1月4日）

• 修复了使用<Field /> 组件创建的无格式复选框 无法切换其关联 v-model 值的问题

v4.1.3（20年1月2日）

• 现在，您可以为useField提供值类型

v4.1.2（2020年12月26日）

• 添加了useSubmitForm合成API帮助程序，其功能与handleSubmit类似，但具有合成API样式。

v4.1.1（12/19/2020）

• 修复了useFieldError和useFormErrors缺少的导出

v4.0.6（12/15/2020）

• 向<Field />组件添加了非检查值属性，以允许创建切换值字段
• <Field />和<Form />组件的次要性能增强
• bug修复

v4.0.5（12/12/2020）

• 向Field组件添加了validateOnInput，validateOnUpdate，validateOnBlur，validateOnModelUpdate道具，以自定义每个字段实例的验证触发器

v4.0.4（12/09/2020）

• 向<Form />和useForm（）添加了SubmitCount状态
• 修正错误

v4.0.3（12/05/2020）

• 修复了无线电输入值被字符串化的问题

v4.0.2（12/05/2020）

• 修复：正则表达式规则无法正常工作

v4.0.1（11/25/2020）

• 确保传承本土 blur 和 input 与 change 听众呈现 Field 输入节点

v4.0.0（11/16/2020）

• Vue.js的更新。

v3.4.5（11/11/2020）

• 固定的双重规则签名与扩展TypeScript签名不兼容

v3.4.4（11/08/2020）

• 修复：不匹配的双重规则签名关闭

v3.4.3（10/22/2020）

• 在ValidationObserver范围内的插槽道具上公开的validateWithInfo

v3.4.2（10/21/2020）

• 将validateWithInfo公开为Observer slot-prop

v3.4.1（10/11/2020）

• 添加了双重规则以使用逗号或点作为分隔符来验证十进制数字

v3.4.0（09/21/2020）

• 修复了一个长期存在的问题，其中验证观察者validate（）方法不会立即同步观察者实例上的错误
• 在ValidationObserver实例上添加了validateWithInfo函数，该函数返回有关验证运行的更多信息，它返回带有isValid，错误，字段和标志的对象

v3.3.11（09/11/2020）

• 修复了针对其他字段（如排除）的无限参数不会映射到其目标值的问题

v3.3.8（08/01/2020）

• 固定withValidation不保留包装的组件作用域插槽
• i18n更新

v3.3.7（07/01/2020）

• 错误修正

v3.3.6（06/27/2020）

• 将params参数标记为非可选参数，因为将始终提供

v3.3.5（06/20/2020）

• 修复：在重新渲染期间添加了NaN检查值是否相等

v3.3.4（06/17/2020）

• 更新了i18n
• 向图像规则添加了图像/ Webp支持

---