Vue-ANTD表单输入中自定义校验一些正则表达式规则介绍
更新时间：2024年01月03日 10:19:35 作者：一颗知足的心
这篇文章主要介绍了Vue-ANTD表单输入中自定义校验一些正则表达式规则介绍,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
写一个示例
表单的rules里面添加自定义校验的方法：
{ rules: [ {validator: this.checkPhone} ] }在下面的method里面添加方法：
checkPhone (rule, value, callback) {
const pwdRegex = new RegExp('^[1-9]\\d{0,11}$')
if (!pwdRegex.test(value)) {
callback(new Error('电话号码输入格式有误'))
}
callback()
},
1.校验输入为电话号码（手机号码）
^((13[0-9])|(14[5,7])|(15[^4,\\D])|(17[0,1,3,6-8])|(18[0-9])|(19[8,9])|(166))[0-9]{8}$2.校验输入为是否为邮箱
/^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/3.校验是否全部为数字且有一范围
^[1-9]\\d{0,11}$ 或者 ^[1-9]\d{0,11}$4.校验输入包含数字+字母+特殊符号
^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{6,20}$5.校验输入包含字母加数字
其实这三者可以随意组合的
有些两边要加引号，有些不加，都试试吧
'^[A-Za-z0-9]{6,6}$'6.输入0-10的整数，输入1-999的整数
/^([0-9]|10)$/
/^(?!0)\d{1,3}$/
后面还会添加更多常用规则
更多规则点击这里
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
本篇文章主要介绍了利用VUE框架，实现列表分页功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下。2017-01-01
这篇文章主要为大家详细介绍了Vue.JS入门教程之自定义指令,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
Vue是一套用于构建用户界面的渐进式框架,与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用,下面这篇文章主要给大家介绍了关于vue使用csp的相关资料,需要的朋友可以参考下2022-08-08
解决vue初始化项目一直停在downloading template的问题
这篇文章主要介绍了解决vue初始化项目一直停在downloading template的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
下面小编就为大家分享一篇vue获取当前点击的元素并传值的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
今天小编就为大家分享一篇vue表单自定义校验规则介绍，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
这篇文章主要介绍了Vue2.0用户权限控制解决方法以及源码说明，一起学习下。2017-11-11
今天小编就为大家分享一篇浅谈v-for 和 v-if 并用时筛选条件方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要为大家介绍了Vue3基于rem比例H5缩放方案示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-11-11
Vue.js 专注于 MVVM 模型的 ViewModel 层。它通过双向数据绑定把 View 层和 Model 层连接了起来。Vue.js和其他库相比是一个小而美的库，作者的主要目的是通过一个尽量简单的 API 产生可反映的数据绑定和可组合的视图组件，感觉作者的思路非常清晰。2016-04-04
最新评论