vuelidate是一個(gè)非常強(qiáng)大的基于vue的表單驗(yàn)證框架捷沸，但是奈何其文檔寫的很一般，自定義驗(yàn)證規(guī)則在文檔里只寫幾句話一筆帶過痒给。對作者的惜字如金表示很難理解。下來我來補(bǔ)全一下幾個(gè)重要的demo尼斧。
前提
//確保引入
import { withParams, regex } from "vuelidate/lib/validators/common.js"
1.自定義帶參數(shù)的驗(yàn)證規(guī)則试吁。
//my-validators.js
export var maxMin = function(max,min){
return withParams({type:maxMin},function(value){
return !!value && max>value && min<value;
})
}
import {maxMin} from "path/to/my-validators.js"
//使用
{
......
validations:{
field:{
maxMin:maxMin(10,50)
}
}
}
2.自定義正則驗(yàn)證規(guī)則
//my-validators.js
export var phone = regex('phoneNumber', /^1(3|4|5|7|8)\d{9}$/);
//使用
import {phone} from "path/to/my-validators.js"
{
......
validations:{
field:{
phone
}
}
}
3.or的使用
//使用
import {phone,maxMin} from "path/to/my-validators.js"
{
......
validations:{
field:{
or:or(phone,maxMin(10,50))
}
}
}
