关于vue使用验证器: VeeValidate3-木庄网络博客

2022-03-22 12:39:08 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者藏色散人，侵删。

推荐：《vue.js教程》

前言

我用的是vee-validate版本为3.3.7

安装教程

1	`cnpm install vee-validate --save`

新建文件vee-validate.js

import { extend, ValidationObserver, ValidationProvider, localize } from 'vee-validate'import { required, email, min, between, numeric } from 'vee-validate/dist/rules'import zh_CN from 'vee-validate/dist/locale/zh_CN.json';localize('zh_cn',zh_CN) // 配置中文export default {
  install (Vue) {
    Vue.component('ValidationObserver', ValidationObserver)
    Vue.component('ValidationProvider', ValidationProvider)
    extend('required', required)
    extend('email', email)
    extend('min', min)
    extend('between', between)
    extend('numeric', numeric)
    extend('phone', {
      message: '请输入11位的手机号码',
      validate: value => value.length === 11 && /^1[3456789]\d{9}$/.test(value)
    })
  }}