vue+element表单校验
1.字母数字组合
export function numberSrting(rule, value, callback) {
if (!value) {
callback();
} else {
let reg = /1*$/g;
if (reg.test(value)) {callback();
} else {callback(new Error("必须为数字、字母组合"));
}
}
}
2.经度纬度校验
// 经度校验
export function lonValid(rule, value, callback) {
if (!value) {
callback();
} else {
const longrg =
/2?(((0|1?[0-7]?[0-9]?)|([1-9]?[0-9]?))(([.][0-9]{1,15})?)|180(([.][0]{1,15})?))$/;
if (value && !longrg.test(value)) {
callback(new Error(“经度整数部分为0-180,小数部分为0到15位!”));
}
callback();
}
}
// 纬度校验
export function latValid(rule, value, callback) {
if (!value) {
callback();
} else {
const latreg = /3?([1-8]?\d(.\d{1,15})?|90(.0{1,15})?)$/;
if (value && !latreg.test(value)) {
callback(new Error(“纬度整数部分为0-90,小数部分为0到15位!”));
}
callback();
}
}
3.身份证校验
export const validateteChoperatePeopleCar = (rule, value, callback) => {
let _IDRe18 =
/^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
// 校验身份证:
if (value && !_IDRe18.test(value)) {
callback(new Error(“正确输入身份证格式”));
return;
}
callback();
};
4.车牌号校验
// 车牌
export const checkCarNum = (rule, value, callback) => {
let reg = /^([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}a-zA-Z$/
if (value && !reg.test(value)) {
callback(new Error(“正确输入正确的车牌号”));
return;
}
callback();
};
5.邮箱校验
export function isMailBox(rule, value, callback) {
if (!value) {
callback();
} else {
let isMail =
/^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
let mailVal = value + “.com”;
if (isMail.test(mailVal)) {
callback();
} else {
callback(new Error(“请输入正确的邮箱格式”));
}
}
}
6.手机号固话校验
export function isPhoneOrMob(rule, value, callback) {
if (!value) {
callback();
} else {
var reg = /^(([0-9]{3,4}-)?[0-9]{7,8}|(1[3456789]\d{9}))$/; //校验手机号和固定电话
if (!reg.test(value)) {
callback(new Error(“请输入正确的号码格式(固话区号请用‘-’区分)”));
} else {
callback();
}
}
}
0-9a-zA-Z ↩︎
-+ ↩︎
-+ ↩︎
vue+element表单校验相关推荐
- 【VUE 表单验证】vue Element 表单验证中 多层v-for验证方法
vue Element 表单验证中 对象有list列表如何验证 正常情况下只需要<el-form-item> 标签中填入prop数据属性即可. <el-form-item label ...
- activeform表单中的旧数据怎么显示_三分钟为你细数 Vue el-form 表单校验的坑点
背景 Vue 的 el-form 提供了表单校验功能,通过 :rules 属性设置校验规则,并通过 el-form-item 的 prop 属性绑定校验规则.通过封装,让前端校验更方便.具体使用过程中 ...
- element表单校验
通过一个案例来示意:element的表单校验 html部分: <template><div id="app"><el-form :model=&quo ...
- element表单校验输入框手动清空时出现XXX is required提示
使用element UI el-form表单校验时,当输入框手动清空内容时会出现XXX( Form-Item 的 prop 属性设置的校验字段名) is required提示,输入框失去焦点之后,又恢 ...
- VUE + Element-UI 表单校验input框数据已存在
基础校验方式实现 html代码 <el-form-item label="值名称:" style="width: 80%" prop="valu ...
- vue+Element表单验证+数字英文密码和手机号验证(详细)
项目开发时需要用到表单验证,密码验证和手机验证都是使用正则表达式,特此记录一下. 1.表单图 2.代码 <template><!-- 结构 --> //就是你要输入的名称< ...
- Vue.js 表单校验插件
Vuerify 是一个简单轻量的数据校验插件.内置基础的校验规则和错误提示.可自定义规则,规则类型支持正则.函数或者字符串.校验规则可全局注册也可以组件内注册.插件会给 vm 添加 $vuerify ...
- vue自定义表单校验
1.绑定规则 1.在form上绑定规则 :rules="formValidate" 实现规则 var jiaoyan=(rules, value,callback)=>{if ...
- vue+element ui表单校验(邮箱、电话、工商信息)
vue+element ui表单校验(邮箱.电话.工商信息)) Html部分 <template><div><el-steps :active="active& ...
最新文章
- CB Insights发布AI创业公司100榜单 ,7家中国公司上榜,两家二次登榜
- C语言问题,在位运算中,操作数每右移一位,其结果相当于什么?若左移1位,其结果相当于什么?
- linux服务器su之后变成bash-4.1#
- P3338 [ZJOI2014]力 FFT + 推式子
- Ubuntu下安装OpenSSH Server并在客户端远程连接Ubuntu
- 1台车至少赚1万块!华为卖车,两天订单破3000辆
- u-boot移植随笔:关于u-boot引导内核出现“Error: unrecognized/unsupported machine ID (r1 = 0x33f4fee8)”的问题
- 栈增长方向与大端/小端问题
- 华栖云科技图形图像视音频算法岗面试经验
- MMO-SNS类游戏服务器间数据交互策略分享
- python编写网络防火墙_firewall防火墙
- 什么是身份证ocr识别?身份证ocr识别接口API能干什么?
- 【老生谈算法】matlab实现无标度网络算法源码——无标度网络
- 数据库文档 SCREW 一键生成数据库文档
- 暗黑复制服务器物品,暗黑2战网环境下复制dupe物品装备
- 应用之星:在线手机应用开发平台 不用搭建环境
- 硕士学位论文写作分享
- lmi克罗内克积 matlab_LMI中有关于克罗内克积的决策变量,如何定义?
- dede采集过滤规则
- 蔡康永的201堂情商课