veeValidate

网站

http://vee-validate.logaretm.com/index.html#about

自定义为空时候的提示

Field-specific Custom Messages

You might need to provide different messages for different fields, for example you might want to display an error message for the email field when its required, but a different messsage when the name is required. This allows you to give your users a flexible experience and context aware messages.

To do this you would need to add an object to the dictionary called custom like this:

const dict = {
  en: {
    custom: {
      email: {
        required: ‘Your email is empty‘ // messages can be strings as well.
      },
      name: {
        required: () => ‘Your name is empty‘
      }
    }
  }
};

Notice that the custom object contains properties that represent the field names, those field names objects contain properties that represent the validation rule that its value will be used instead of the default one.

Then you would need to add the dictionary we just constructed to the current validators dictionary like this:

Validator.updateDictionary(dict);
// or use the instance method
this.$validator.updateDictionary(dict);
时间: 2024-07-28 14:10:50

veeValidate的相关文章

Vue如何使用vee-validate表单验证

Vue项目遇到要表单验证了吧,对我来说表单验证是个很纠(dan)结(teng)的内容,各种判断凌乱到飞起.往常使用jquery的validate插件做表单验证方便吧,你也可以在Vue里引入jquery的validate插件(如何引入jquery在我上一篇博文有介绍,点击查看).但是我们是做vue项目也,不到实在解决不了还是建议不要引入,因为Vue自己就有表单验证的插件,那就是vee-validate. 我在这并不是详细讲解vee-validate的使用功能,只是快速了解如何在项目里使用vee-v

使用vee-validate表单插件是如何设置中文提示?

最近在写vue表单验证的时候,在网上找到一款不错的插件vee-validate,在使用的过程中发现配置不了中文提示,这就很苦恼了,基本上网上的配置办法我都看过,都是有问题的,比如这种 import zh_CN from 'vee-validate/dist/locale/zh_CN'; //引入中文包,提示信息可以以中文形式显示 import { Validator } from 'vee-validate'; Validator.addLocale(zh_CN); // 设置提示信息中文方式显

vue2移动端使用vee-validate进行表单验证

使用vee-validate时若要使用中文版本提示时,vee-validate的版本需要注意 "vee-validate": "2.0.0-rc.25" 在main.js里添加如下代码 import VeeValidate, { Validator } from 'vee-validate' import CN from 'vee-validate/dist/locale/zh_CN.js' Validator.addLocale(CN) Vue.use(VeeVa

关于 vee-validate直接引用的方法

转载于:https://blog.csdn.net/hy111/article/details/79046500?%3E 由于当前项目使用的是基于jQuery的前端结构,尝试在新增需求中使用VUE2,对于表单验证使用vee-validate. 当前基于webpack项目,使用npm引入的样例比较多. 目前在普通页面中使用的经验进行积累,以供参考,为了考虑系统兼容性,项目中暂时没有使用ES6的写法. 官网地址:http://vee-validate.logaretm.com/ 1.引入vue2后,

直接引用vee-validate校验插件

直接在页面引用vee-validate 源文件下载地址:http://www.bootcdn.cn/vee-validate/ 官方api https://baianat.github.io/vee-validate/guide/rules.html#is-not <script th:src="@{/js/vee-validate/vee-validate.min.js}"></script> <script th:src="@{/js/vee

Vue 表单校验 vee-validate

gitHub 地址:https://github.com/baianat/vee-validate 官网API 地址:https://baianat.github.io/vee-validate/api/ 配置 先下载到项目 npm install vee-validate --save 封装一个自定义指令,方便后面使用 import {Validator, install as VeeValidate} from 'vee-validate'; import {required, min, m

vue表单验证,vee-Validate

1.下载安装 npm install vee-validate --save 2.main.js 添加 //vue表单验证插件 import VeeValidate,{Validator} from 'vee-Validate'; //没有配置过的错误提示默认使用英文显示的, //如果想要用中文显示需要我们手动配置一下 import zh from 'vee-validate/dist/locale/zh_CN';   Validator.localize('zh', zh); //blur 失

webpack构建vue项目(再谈配置)

webpack配置起来确实麻烦,这不,之前用刚配好了vue1+的版本,结果在(部分)安卓机上测试,发现存在开启热加载(dev-server)的情况下不能识别vue语法的问题,试了很多方法,都没能很好的解决,最后索性将vue升级到2+,竟然就能识别了,好吧! 1.先分享一下webpack配置vue2+的一些不同(本人亲测): (1)dependencies中的vue默认安装2+,直接运行,会报如下错:[Vue warn]: Failed to mount component: template o

vue-validator 使用详解

  自定义配置文件(validateConfig): import Vue from 'vue' import VeeValidate, { Validator } from 'vee-validate' const dictionary = { en: { messages: { // <input type="text" v-model="phoneNumber" name="phone" v-validate="'requi