验证内容

（1）1-32位，中文、英文、数字及特殊字符_-，必须以中文或英文字符开头
（2）1-32位，中文、英文、数字及特殊字符_-，必须以中文、英文、数字开头

data() {// 表单自定义校验const validNameType = (rule, value, callback) => {var regex = new RegExp('^([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[a-zA-Z])(([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[-_a-zA-Z0-9]){0,31})$')if (value === '') {callback(new Error('请输入内容'))} else if (!regex.test(value)) {callback(new Error('只支持以中文或英文开头，由中文、英文、数字及特殊字符_-组成，1-32位'))} else {callback()}}const validmodelType = (rule, value, callback) => {var regex = new RegExp('^([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[A-Za-z0-9])(([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[-_a-zA-Z0-9]){0,31})$')if (value === '') {callback(new Error('请输入内容'))} else if (!regex.test(value)) {callback(new Error('只支持以中文、英文或数字开头，由中文、英文、数字及特殊字符_-组成，1-32位'))} else {callback()}}return {rules: {productName: [{ required: true, validator: validNameType, trigger: 'blur' }],model: [{ required: false, validator: validmodelType, trigger: 'blur' }]}}}

校验内容

（1）邮箱
（2）手机号
（3）身份证号

return {rules: {userEmail: [{pattern: /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,message: '请输入正确格式的邮箱',trigger: 'blur'}],userPhone: [{ required: true, message: '手机号码不能为空', trigger: 'blur' },{pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,message: '请输入正确格式的手机号码',trigger: 'blur'}],identityCard: [{ required: true, message: '身份证号不能为空', trigger: 'blur' },{pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,message: '请输入正确格式的身份证号',trigger: 'blur'}]}}

【vue 项目】表单正则表达式校验1-32位，中文、英文、数字及特殊字符_-，必须以中文或英文字符开头等相关推荐

vue单个表单的校验清空
let field=this.$refs['basicForm'].fields; field.map(i=>{if(i.prop==='xxx'){//通过prop属性值相同来判断是哪个输入框 ...
element手机验证格式_基于Vue+elementUI实现动态表单的校验功能(根据条件动态切换校验格式)...
前言开发过程中遇到了一个需求,根据用户选择的联系方式,动态改变输入框的检验条件,并且整个表单是可以增加的在线访问:动态表单校验 github(欢迎star): https://github.com ...
vue表单rules校验
文章目录一.表单校验 1. 表单项校验 2. 表单整体校验二.规则模板三.踩坑合集 1. 单项规则校验没问题,表单整体校验不通过? 一.表单校验此部分详情可参考此博客<在vue中使用ru ...
Element Ui使用技巧——Form表单的校验规则rules详细说明；element的 form 表单rules详细用法
本文章是在项目开发时遇到问题看到的一片好文, 摘录自[博客园]–[逍遥云天]. 感谢作者地址 – https://www.cnblogs.com/xyyt/p/13366812.html 在 [逍遥 ...
关于Vue的表单验证
前言最近在研究 Vue 如何实现表单的验证,在网上查阅资料以后,简单将这些方法整合一下,方便以后学习.如果有不准确之处,还望指正. Vue 实现表单验证的方法有如下几种: 一.基于 Vue 与 jQ ...
redux-form V.7.4.2学习笔记（六）表单同步校验技术
一.客户端同步校验支持 redux-form V.7.4.2提供了两种方法可以为表单提供同步客户端校验支持. 第一种是为整个redux-form提供校验函数,该函数接受一个以表单中所有值组成的对象作为 ...
[vue] 说说你对vue的表单修饰符.lazy的理解
[vue] 说说你对vue的表单修饰符.lazy的理解 input标签v-model用lazy修饰之后,vue并不会立即监听input Value的改变,会在input失去焦点之后,才会触发input ...
vue监控表单输入事件，正则验证手机号，邮箱
vue监控表单输入事件,正则验证手机号,邮箱 <div class="input-name"><inputclass="input-type" ...
【VUE 表单验证】vue Element 表单验证中多层v-for验证方法
vue Element 表单验证中对象有list列表如何验证正常情况下只需要<el-form-item> 标签中填入prop数据属性即可. <el-form-item label ...

【vue 项目】表单正则表达式校验1-32位，中文、英文、数字及特殊字符_-，必须以中文或英文字符开头等

验证内容

校验内容

【vue 项目】表单正则表达式校验1-32位，中文、英文、数字及特殊字符_-，必须以中文或英文字符开头等相关推荐

最新文章

热门文章