自定义校验规则

main.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import Vue from 'vue'
import App from './App.vue'
import router from './router.js'
import "./vee-validate"
import axios from 'axios';

Vue.config.productionTip = false

axios.defaults.baseURL=process.env.NODE_ENV!=='production'?'http://localhost:3000':'http://aaa.cxvh.com'

new Vue({
router,
render: h => h(App),
}).$mount('#app')

vee-validate.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
import Vue from 'vue'
import {
ValidationProvider,
ValidationObserver,
localize,
extend
} from 'vee-validate'
import * as rules from 'vee-validate/dist/rules';
import zh from './local/index.json'
rules.diff_max_min = {
validate: function (value, _a) {
var _b = _a === void 0 ? {} : _a,
min = +_b.min,
max = +_b.max;
return String(value).length <= max && String(value).length >= min;
},
params: [{
name: 'min'

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

// localize({zh})
// localize('zh',zh)
localize('zh', zh);
Vue.component('ValidationProvider', ValidationProvider);
Vue.component('ValidationObserver', ValidationObserver);

local/index.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
{
"code":"zh",
"messages": {
"email": "请输入正确的邮箱格式",
"length": "{_field_}长度要求{length}",
"confirmed": "{_field_}不能和{target}匹配",
"min": "{_field_}必须至少有{length}个字符",
"max": "{_field_}必须最多有{length}个字符",
"diff_max_min":"{_field_}必须在{min}与{max}之间",
"required": "请输入{_field_}"
},
"names": {
"nickname": "昵称",
"password": "密码",
"rpassword": "确认密码",
"name": "账号",
"code": "验证码"
},
"fields": {
"password": {
"min": "不符合最小长度要求"
},
"rpassword":{
"confirmed":"两次密码不一致"
}
}
}