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

1.邮箱校验规则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.邮箱校验规则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.mzph.cn/news/122769.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

windows8080端口占用

windows8080端口占用

查看端口占用 netstat -ano | findstr “8080”查看占用进程 tasklist | findstr “4664”关闭占用进程 taskkill /f /t /im httpd.exe
阅读更多...
数据结构|基础知识定义

数据结构|基础知识定义

1.值传递、地址传递、值返回、地址返回 1> 值传递&#xff1a;普通变量作为函数参数传递是单向的值传递&#xff0c;只是将实参的值复制一份给形参变量&#xff0c;形参的改变不会影响实参的值&#xff0c;因为所在内存空间不同 如果传递的是地址&#xff0c;被调函数使用指…
阅读更多...
centos中安装Mysql8.0

centos中安装Mysql8.0

其实和mysql5.7的安装差不多 1.root用户 2.更新密钥 rpm --import https://repo.mysql.com/RPM-GPG-KEY-mysql-2022 3.安装mysql yum库 rpm -Uvh https://dev.mysql.com/ get/mysql80-community-release-el7-2.noarch.rpm 4.通过上两步&#xff0c;我们就可以使用yum去安装…
阅读更多...
metersphere 接口自动化

metersphere 接口自动化

Metersphere 使用步骤大致如下&#xff1a; 安装 Metersphere Metersphere 是一款基于 Docker 的应用程序&#xff0c;因此在使用 Metersphere 之前&#xff0c;需要先安装 Docker。安装 Docker 后&#xff0c;再下载 Metersphere 的安装包并解压缩。 启动 Metersphere 在终…
阅读更多...
超详细的Windows 11虚拟机安装教程

超详细的Windows 11虚拟机安装教程

准备安装文件创建虚拟机Windows安装 准备安装文件 1、安装好VMware WorkStation 16 Pro&#xff08;越新越好&#xff09; 2、下载好Windows 11系统镜像 其中VMware的安装教程看我往期推送&#xff0c;至少用我提供的16.2版本&#xff0c;低版本的会出现蓝屏问题。Windows …
阅读更多...
2024王道考研计算机组成原理——输入输出系统

2024王道考研计算机组成原理——输入输出系统

7.1.1 输入输出系统和几种IO控制方式 输入设备&#xff1a;把数据从主机外部输入主机内部 输出设备&#xff1a;把数据从主机内部输出到主机外部 现在的IO接口(芯片)通常被集成在南桥芯片的内部 DMA接口其实也是IO接口(芯片)的一种&#xff0c;磁盘准备的数据先一个字一个字…
阅读更多...
node 第十二天 npm补充 详解package-lock.json在团队协作中的作用

node 第十二天 npm补充 详解package-lock.json在团队协作中的作用

1.npm 是Node的开放式模块登记和管理系统&#xff0c;是Node.js包的标准发布平台&#xff0c;用于Node.js包的发布、传播、依赖控制 2.今天主要说的是package-lock.json在团队协作中的作用(yarn.lock也是一样), 其实在npm5之后和yarn的区别已经很小了 正常项目用哪个都行, 几乎…
阅读更多...
一个简单的注册的页面，如有错误请指正；（3.JavaScript）

一个简单的注册的页面，如有错误请指正；（3.JavaScript）

这段代码是一个JavaScript函数&#xff0c;实现了用户登录和上传图片的功能&#xff0c;并包含了一些辅助函数。让我一一解释&#xff1a; 1. login()&#xff1a;这个函数用于登录操作。首先&#xff0c;通过$(#name).val()来获取ID为name的元素的值&#xff0c;同理获取其他…
阅读更多...
【JAVA学习笔记】 51 - 日期类

【JAVA学习笔记】 51 - 日期类

项目代码 一、第一代日期类 1.Date: 精确到亳秒&#xff0c;代表特定的瞬间 2.SimpleDateFormat:格式和解析日期的类 3.SimpleDateFormat格式化和解析日期的具体类。它允许进行格式化(日期> 文本)、解析(文本->日期)和规范化 public class Date01 {public static voi…
阅读更多...
机器学习（python）笔记整理

机器学习（python）笔记整理

目录 一、数据预处理&#xff1a; 1. 缺失值处理&#xff1a; 2. 重复值处理&#xff1a; 3. 数据类型&#xff1a; 二、特征工程: 1. 规范化&#xff1a; 2. 归一化&#xff1a; 3. 标准化(方差)&#xff1a; 三、训练模型&#xff1a; 如何计算精确度&#xff0c;召…
阅读更多...
阿里蚂蚁淘宝等多次一面面试面经

阿里蚂蚁淘宝等多次一面面试面经

一面采用电话面试笔试链接做算法题&#xff08;可能开视频&#xff09;的形式 蚂蚁第一次&#xff1a; 自我介绍 技术一般使用开源技术还是自己研发 开源spring cloud等 流水线用来做什么 用户是什么人 应用场景 是toB的对吧 学到的最前沿的技术有哪些 gateway全局权限…
阅读更多...
Openssl数据安全传输平台016：在QT中的数据库操作+在项目中的设计与实现

Openssl数据安全传输平台016：在QT中的数据库操作+在项目中的设计与实现

文章目录 1 在QT中 的数据库操作1.1 QSqlDatabase1.2 QSqlQuery 2 QT中json相关的操作类2.1 json格式字符串 -> json文档对象2.2 组织一个json数组/json对象 -> 写文件/发送 1 在QT中 的数据库操作 在Qt中进行数据库操作需要使用的类: QSqlDataBase 属于的模块: sql 使用…
阅读更多...
.NET CORE 3.1 集成JWT鉴权和授权2

.NET CORE 3.1 集成JWT鉴权和授权2

JWT&#xff1a;全称是JSON Web Token是目前最流行的跨域身份验证、分布式登录、单点登录等解决方案。 通俗地来讲&#xff0c;JWT是能代表用户身份的令牌&#xff0c;可以使用JWT令牌在api接口中校验用户的身份以确认用户是否有访问api的权限。 授权&#xff1a;这是使用JWT的…
阅读更多...
搭建gnn环境

搭建gnn环境

1.无法激活 激活pytorch遇到报错usage: conda-script.py [-h] [--no-plugins] [-V] COMMAND ... conda-script.py: error: arg-CSDN博客 参考教程 【精选】手把手教你在windows10安装GNN相关环境&#xff08;torchtorch_geometricrdkitdeepchem&#xff09;_gnn环境相关的包-…
阅读更多...
redis6.0源码分析：字典扩容与渐进式rehash

redis6.0源码分析：字典扩容与渐进式rehash

文章目录 字典数据结构结构设计dictType字典类型为什么字典有两个哈希表&#xff1f;哈希算法 扩容机制扩容前置知识字典存在几种状态&#xff1f;容量相关的关键字段定义字典的容量都是2的幂次方 扩容机制字典什么时候会扩容&#xff1f;扩容的阈值 & 扩容的倍数哪些方法会…
阅读更多...
matlab中类的分别之handle类和value类——matlab无法修改类属性值的可能原因

matlab中类的分别之handle类和value类——matlab无法修改类属性值的可能原因

写在之前&#xff08;吐槽&#xff09; 最近由于变化了一些工作方向&#xff0c;开始需要使用matlab进行开发&#xff0c;哎哟喂&#xff0c;matlab使用的我想吐&#xff0c;那个matlab编辑器又没代码提示&#xff0c;又没彩色&#xff0c;我只好用vscode进行代码编辑&#xf…
阅读更多...
MySQL篇---第六篇

MySQL篇---第六篇

系列文章目录 文章目录 系列文章目录一、 MySQL 中 varchar 与 char 的区别？varchar(30) 中的 30代表的涵义？二、 int(11) 中的 11 代表什么涵义？三、为什么 SELECT COUNT(*) FROM table 在 InnoDB 比MyISAM 慢？一、 MySQL 中 varchar 与 char 的区别？varchar(30) 中的 30…
阅读更多...
EASYX动画效果实现

EASYX动画效果实现

eg1:绘制小球的动画效果 通过一下的代码实现小球从左向右移动效果&#xff0c;计算小球的移动速度和帧率实现移动效果平和造成视觉上的错觉 #include <stdio.h> #include <easyx.h> #include <iostream> #include <math.h> #define PI 3.14 // 1PI …
阅读更多...
springboot在线招聘系统

springboot在线招聘系统

springboot在线招聘管理系统&#xff0c;java在线招聘管理系统&#xff0c;在线招聘管理系统 运行环境&#xff1a; JAVA版本&#xff1a;JDK1.8 IDE类型&#xff1a;IDEA、Eclipse都可运行 数据库类型&#xff1a;MySql&#xff08;8.x版本都可&#xff09; 硬件环境&#xf…
阅读更多...
虚机Centos忘记密码如何重置

虚机Centos忘记密码如何重置

1进入开机前的页面&#xff0c;选中第一个&#xff0c;按“e”键&#xff0c;进入编辑模式 2找到ro crashkernel项&#xff0c;将ro替换成 rw initsysroot/bin/sh 3 Ctrlx mount -o remount, rw / chroot /sysroot chroot /sysroot passwd root 输入两次密码 touch /.a…
阅读更多...
最新文章

Copyright @ 2022~2023