Vue2.0表单校验组件vee(2)

const validator = { getMessage(field, args) { // 添加到默认的英文错误消息里面 // Returns a message. }, validate(value, args) { // Returns a Boolean or a Promise. } };

3.添加到指定语言的错误消息

const validator = { messages: { en: (field, args) => { // 英文错误提示 }, cn: (field, args) => { // 中文错误提示 } }, validate(value, args) { // Returns a Boolean or a Promise. } };

创建了规则之后，用extend方法添加到Validator里面

import { Validator } from 'vee-validate'; const isMobile = { messages: { en:(field, args) => field + '必须是11位手机号码', }, validate: (value, args) => { return value.length == 11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/.test(value) } } Validator.extend('mobile', isMobile); //或者直接 Validator.extend('mobile', { messages: { en:field => field + '必须是11位手机号码', }, validate: value => { return value.length == 11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/.test(value) } });

然后接可以直接把mobile当成内置规则使用了：

<input v-validate data-rules="required|mobile" :class="{'input': true, 'is-danger': errors.has('mobile') }" type="text" placeholder="Mobile"> <span v-show="errors.has('mobile')">{{ errors.first('mobile') }}</span>

4.自定义内置规则的错误信息

import { Validator } from 'vee-validate'; const dictionary = { en: { messages: { alpha: () => 'Some English Message' } }, cn: { messages: { alpha: () => '对alpha规则的错误定义中文描述' } } }; Validator.updateDictionary(dictionary);

暂时介绍到这里，应该已经上手了，有空再继续翻译。

其它问题或者更高级应用，请参考官方文档Vee-Validate