当前位置: 首页 > news >正文

常用的表单校验规则——邮箱/QQ/身份证号码/微信/电话/数字字母/整数/文本/密码等

1.邮箱校验规则

//邮箱校验
export const validateEmail = async (RuleObject, value) => {// const reg = new RegExp(/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+$/)const reg = new RegExp(/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/)if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的邮箱');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

2.邮箱校验规则

export const validateEmail1 = async (RuleObject, value) => {const reg = new RegExp(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的邮箱');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

 3.QQ校验规则

//qq校验
export const validateQQ = async (RuleObject, value) => {const reg = new RegExp(/^[1-9][0-9]{4,10}$/);if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的QQ号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

4.身份证号码校验规则 

//身份证号校验
export const validateIdCard = async (RuleObject, value) => {const reg = new RegExp(/(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0[1-9]|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/);const reg1 = new RegExp(/^[A-Z]\d{7,11}$/)if (value) {if (!reg1.test(value)&&!reg.test(value)) {return Promise.reject('请输入正确的身份证号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

 5.微信校验规则

//微信校验
export const validateCharts = async (RuleObject, value) => {const reg = new RegExp(/^[a-zA-Z][-_a-zA-Z0-9]{5,19}$/);if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的微信号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

6.电话校验规则 

//电话校验
export const validatPhone = async (RuleObject, value) => {const reg = new RegExp(/^(?:(?:\+|00)86)?1[3-9]\d{9}$/);if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的手机号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

7.银行卡号校验规则 

//银行卡号校验
export const validatBankCard = async (RuleObject, value) => {const reg = new RegExp(/^[1-9]\d{9,29}$/);if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的银行卡号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

8.数字字母校验规则 

//数字字母校验
export const validatNumberLetter = async (RuleObject, value) => {const reg = new RegExp(/^([A-Z]|[a-z]|[\d])*$/);if (value) {if (!reg.test(value)) {return Promise.reject('请输入正确的工号');} else {return Promise.resolve();}} else {return Promise.resolve();}
}

9.整数校验规则 

//整数校验
export const validateInitNumber = async (RuleObject, value, min, max) => {if (value !== '' && value !== null && value !== undefined) {if (!Number(value) && value !== 0) {return Promise.reject('请输入数字');} else if (!Number.isInteger(Number(value))) {return Promise.reject('请输入整数');} else {if (max) {value = Number(value);if (value > max || value < min) {return Promise.reject('请输入' + min + '到' + max + '之间的数值');} else {return Promise.resolve();}} else {return Promise.resolve();}}} else {return Promise.resolve();}
}

10.数字校验规则 

//数字校验
export const validateNumber = async (RuleObject, value, min, max) => {if (value !== '' && value !== null && value !== undefined) {if (!Number(value) && value !== 0) {return Promise.reject('请输入数字');} else {if (max) {if (value > max || value < min) {return Promise.reject('请输入' + min + '到' + max + '之间的数值');} else {return Promise.resolve();}} else {return Promise.resolve();}}} else {return Promise.resolve();}
}

11.文本校验规则 

//文本校验
export const validateInitTxt = async (RuleObject, value, min, max) => {if (value) {if (max) {if (value.length > max || value.length < min) {return Promise.reject('请输入' + min + '到' + max + '个字符');} else {return Promise.resolve();}} else {return Promise.resolve();}} else {return Promise.resolve();}
}

12.密码校验规则 

//密码校验
export const validatePWD = async (RuleObject, value, min, max) => {if (value) {if (max) {if (value.length > max || value.length < min) {return Promise.reject('请输入' + min + '到' + max + '个字符');} else {return Promise.resolve();}} else {return Promise.resolve();}} else {return Promise.resolve();}
}

最后附上rules中的使用方法 

import { validateEmail,validateInitTxt, validateQQ, validateIdCard, validatPhone,validateEmail1, validatBankCard, validateInitNumber,validateNumber,validateCharts,validatNumberLetter  } from './validateForm.js';
export default  {'姓名': [{required: true, message: '请输入名字'},{validator: async (RuleObject, value) => validateInitTxt(RuleObject, value, 1, 30), trigger: 'change'}],'年龄': [{required: true, message: '请输入年龄'},{validator: async (RuleObject, value) => validateInitNumber(RuleObject, value, 16, 65), trigger: 'change'}],'身高': [{required: true, message: '请输入身高'},{validator: async (RuleObject, value) => validateInitNumber(RuleObject, value, 140, 210), trigger: 'change'}],'体重': [{required: true, message: '请输入体重'},{validator: async (RuleObject, value) => validateNumber(RuleObject, value, 35, 200), trigger: 'change'}],'邮件': [{required: true, message: '请输入邮件'},{validator: validateEmail, trigger: 'change'}],'邮箱': [{required: true, message: '请输入邮箱'},{validator: validateEmail1, trigger: 'change'}],'QQ': [{required: true, message: '请输入QQ'},{validator: validateQQ, trigger: 'change'}],'微信': [{required: true,message: '请输入微信'},{validator: validateCharts, trigger: 'change'}],'身份证': [{required: true, message: '请输入身份证号'},{validator: validateIdCard, trigger: 'change'}],'电话': [{required: true, message: '请输入联系电话'},{validator: validatPhone, trigger: 'change'}],'银行卡': [{required: true,message: '请输入银行卡卡号'},{validator: validatBankCard, trigger: 'change'}],'留言板': [{required: true,message: '请输入'},{validator: async (RuleObject, value) => validateInitTxt(RuleObject, value, 1, 300), trigger: 'change'}],'输入框50': [{required: true,message: '请输入'},{validator: async (RuleObject, value) => validateInitTxt(RuleObject, value, 1, 50), trigger: 'change'}],'输入框30': [{required: true,message: '请输入'},{validator: async (RuleObject, value) => validateInitTxt(RuleObject, value, 1, 30), trigger: 'change'}],'下拉框': [{required: true, message: '请选择'}],'整数': [{required: true,message: '请输入'},{validator: validateInitNumber, trigger: 'change'}],'组合':[{required: true,message: '请输入'},{validator: validatNumberLetter, trigger: 'change'},],'浮点数': [{required: true,message: '请输入'},{validator: validateNumber, trigger: 'change'}]}

 

 

 

 

 

 

http://www.lryc.cn/news/222564.html

相关文章:

  • Mysql数据库 11.SQL语言 储存过程 下 储存过程管理和游标
  • 如何在Visual Studio上创建项目并运行【超级详细】
  • 《C++ Primer》第7章 类(二)
  • git仓库代码克隆
  • AM@向量代数@向量基本概念和向量线性运算
  • 2023-11-08 LeetCode每日一题(最长平衡子字符串)
  • Web3.0的测试题
  • Javascript知识点详解:对象的继承、原型对象、原型链
  • 学之思开源考试系统部署至Centos7
  • 如何利用浏览器的可见性API优化网站性能
  • 还不知道IP地址不够用是怎么被大牛们解决的?(NAT/NAPT, IPv6, DHCP)
  • 使用决策树预测隐形眼镜类型
  • [ACTF2020 新生赛]BackupFile 1
  • 解决vuex刷新数据丢失
  • linux系统下读取当前硬盘的温度
  • python 深度学习 解决遇到的报错问题8
  • Linux pipe()系统调用示例
  • 音频中的采样率和比特率
  • Python常用脚本
  • Redis5 分布式系统之主从模式
  • 【黑马程序员】Maven 进阶
  • 231108 C语言memset当第三个参数为0,即设置个数为零也不报错
  • HMM与LTP词性标注之马尔科夫模型(HMM原理剖析)
  • Python自动化测试selenium指定截图文件名方法
  • Linux 实现文件后半部分的复制
  • 阿里开源中间件一览
  • Ubuntu20.04下Salome_meca 2022软件安装(支持GPU加速)
  • uniapp:打包ios配置隐私协议框
  • JS逆向爬虫---请求参数加密③【比特币交易爬虫】
  • 云计算:未来科技的超级英雄