VeeValidate

使用VeeValidate

bootstrap vue 的表单验证推荐使用VeeValidate

安装!

效果不错

app.js中添加require('./veevalidate');

使用独立文件引入

veevalidate.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import Vue from 'vue';
import { ValidationObserver, ValidationProvider, extend , localize } from 'vee-validate';
import en from "vee-validate/dist/locale/en.json";
import * as rules from "vee-validate/dist/rules";
import VueI18n from 'vue-i18n'


Object.keys(rules).forEach(rule => {
extend(rule, rules[rule]);
});

localize("en", en);

Vue.component("ValidationObserver", ValidationObserver);
Vue.component('ValidationProvider', ValidationProvider);

使用方法查看官方例子

注意passeshandleSubmit 是相同的 v-slot, 文档中没有写明。