如何将Vue中vee-validator表单校验方案改写为长尾词？

本文共计1419个文字，预计阅读时间需要6分钟。

前言：由于大部分移动端组件库都不提供表单校验功能，因此需要自行封装。

目前，使用较多的表单校验库有async-validator和vee-validator。其中，elementUI组件库提供的表单验证也是基于async-validator和vee。

前言

由于大部分移动端的组件库都不提供表单校验，因此需要自己封装。目前，使用较多的是async-validator和vee-validator。其中，elementUI组件库提供的表单验证也是基于async-validator，vee-validator是一种基于vue模板的轻量级校验框架。可以根据项目的需求，自行选择合适的方案。本文主要讨论的是vee-validator校验方案。

表单校验的封装

在vue项目中，表单校验是每个前端开发人员都避免不了的需求。校验的好处可以避免无用的 http 请求，及校验不通过不发送请求，也可以提高用户的体验效果。

安装

npm install vee-validate --save

引入

一般我们会在src 目录下新建一个文件夹，里面新建一个validator.js 和validatorRule.js 文件。