前端表单提交中,需要对一些数值进行校验;下面就是总结的一些常用的表单校验规则:
//纯数字校验
function validateNumber(rule, value, callback) {
let numberReg = /^\d+$|^\d+[.]?\d+$/
if (value !== '') {
if (!numberReg.test(value)) {
callback(new Error('请输入数字'))
} else {
callback()
}
} else {
callback(new Error('请输入值'))
}
}
//最多一位小数校验
function onePoint(rule, value, callback) {
if (!/^[0-9]+([.]{1}[0-9]{1})?$/.test(value)) {
callback(new Error('最多一位小数!!!'));
} else {
callback();
}
};
//身份证号码校验
function idCard(rule, value, callback) {
if (!value) {
return callback(new Error('身份证不能为空'))
}
if (! /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
callback(new Error('请输入正确的二代身份证号码'))
} else {
callback()
}
}
//两位小数校验
function validateValidity(rule, value, callback) {
if (!/(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/.test(value)) {
callback(new Error('最多两位小数!!!'));
} else {
callback();
}
};
//邮箱校验
function validateEMail(rule, value, callback) {
const reg = /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/;
if (value == '' || value == undefined || value == null) {
callback();
} else {
if (!reg.test(value)) {
callback(new Error('请输入正确的邮箱'));
} else {
callback();
}
}
}
//手机号码校验
function validatePhone(rule, value, callback) {
const reg = /^[1][3-9][0-9]{9}$/;
if (value == '' || value == undefined || value == null) {
callback();
} else {
if ((!reg.test(value)) && value != '') {
callback(new Error('请输入正确的电话号码'));
} else {
callback();
}
}
}
//固定电话校验
function validateTelphone(rule, value, callback) {
const reg = /0\d{2,3}-\d{7,8}/;
if (value == '' || value == undefined || value == null) {
callback();
} else {
if ((!reg.test(value)) && value != '') {
callback(new Error('请输入正确的固定电话)'));
} else {
callback();
}
}
}
//手机号码或固定电话校验
function validatePhoneTwo(rule, value, callback) {
const reg = /^((0\d{2,3}-\d{7,8})|(1[34578]\d{9}))$/;;
if (value == '' || value == undefined || value == null) {
callback();
} else {
if ((!reg.test(value)) && value != '') {
callback(new Error('请输入正确的电话号码或者固话号码'));
} else {
callback();
}
}
}
//ip地址校验
function validateIP(rule, value, callback) {
if (value == '' || value == undefined || value == null) {
callback();
} else {
const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
if ((!reg.test(value)) && value != '') {
callback(new Error('请输入正确的IP地址'));
} else {
callback();
}
}
}
export default {
validateIP, validatePhoneTwo, validateTelphone, validateEMail, validatePhone, validateValidity, idCard, onePoint, validateNumber
}
使用方法为:
import valiRules from '../components/module/validateRules.js';
rules: {
eMail: [{ required: true, message: '不能为空', trigger: 'blur' }, { validator: valiRules.validateEMail, trigger: 'blur' }],
}
11