#yyds干货盘点 【React工作记录十八】常见的正则校验

简介: #yyds干货盘点 【React工作记录十八】常见的正则校验

导语

歌谣 歌谣 这部分邮箱 电话号码等需要加个校验 你快操作操作




编辑


代码部分

//  手机号
const isPhone = /^1[3-9]\d{9}$/;
// const isPhone = /(\d{3}-|\d{4}-)?(\d{8}|\d{7})?/;
// 邮箱
const isEmail = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
// 密码格式
const isPassword = /^[\w~`!@#$%^&*()-+=|\\<>,.?/\[\]{}:;'"]{6,16}$/;
// 身份证
const isIdentity = /^(([1][1-5])|([2][1-3])|([3][1-7])|([4][1-6])|([5][0-4])|
([6][1-5])|([7][1])|([8][1-2]))\d{4}(([1][9]\d{2})|([2]\d{3}))(([0][1-9])
|([1][0-2]))(([0][1-9])|([1-2][0-9])|([3][0-1]))\d{3}[0-9xX]$/;
//港澳
const isHKCard = /^[CW]\d{8}$/;
//台
const isTWCard = '';
// 护照
const isPassPortCard = '';
// 特殊字符
const specialcharactersReg = /^(?!_)(?!.*?_$)[a-zA-Z0-9_\u4e00-\u9fa5]+$/;
export {
  isPhone,
  isEmail,
  isPassword,
  isIdentity,
  isHKCard,
  isPassPortCard,
  isTWCard,
  specialcharactersReg,
};

总结

代码部分对对应的规则做好了正则匹配 然后导出 这样在引入的地方导入 这样就可以使用了

相关文章
|
8月前
|
前端开发
React中Props的详细使用和props的校验
React中Props的详细使用和props的校验
|
4月前
|
前端开发 JavaScript
React配合axios请求拦截校验session,403跳转至登陆页面
React中使用axios进行请求拦截,通过自定义事件监听和响应拦截实现403状态码时的自动登录页面跳转。
140 2
|
4月前
|
前端开发 数据安全/隐私保护
react antd 实现修改密码(原密码,新密码,再次输入新密码,新密码增加正则复杂度校验)
文章介绍了如何在React项目中使用Ant Design实现一个修改密码的组件,包括原密码、新密码和再次输入新密码的表单项,并为新密码增加了正则表达式复杂度校验。
98 0
react antd 实现修改密码(原密码,新密码,再次输入新密码,新密码增加正则复杂度校验)
|
资源调度 前端开发
React 校验库 prop-types 安装与详细使用
React 校验库 prop-types 安装与详细使用
200 0
|
前端开发
#yyds干货盘点 【React工作记录十九】IE校验问题
#yyds干货盘点 【React工作记录十九】IE校验问题
82 0
|
前端开发
react 关闭 eslint代码校验
react 关闭 eslint代码校验
|
前端开发
react中父子组件传值详解,如何进行传值校验(父传子,子组件改变父组件的值)
本篇主要给大家介绍react中父子组件传值详解,如何进行传值校验
671 0
|
前端开发
#私藏项目实操分享# 【React工作记录十九】IE校验问题
#私藏项目实操分享# 【React工作记录十九】IE校验问题
69 0
#私藏项目实操分享# 【React工作记录十九】IE校验问题
|
2月前
|
前端开发 JavaScript 开发者
颠覆传统:React框架如何引领前端开发的革命性变革
【10月更文挑战第32天】本文以问答形式探讨了React框架的特性和应用。React是一款由Facebook推出的JavaScript库,以其虚拟DOM机制和组件化设计,成为构建高性能单页面应用的理想选择。文章介绍了如何开始一个React项目、组件化思想的体现、性能优化方法、表单处理及路由实现等内容,帮助开发者更好地理解和使用React。
95 9
|
3月前
|
前端开发
深入解析React Hooks:构建高效且可维护的前端应用
本文将带你走进React Hooks的世界,探索这一革新特性如何改变我们构建React组件的方式。通过分析Hooks的核心概念、使用方法和最佳实践,文章旨在帮助你充分利用Hooks来提高开发效率,编写更简洁、更可维护的前端代码。我们将通过实际代码示例,深入了解useState、useEffect等常用Hooks的内部工作原理,并探讨如何自定义Hooks以复用逻辑。