这篇文章主要讲解了“Vue正则写法是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Vue正则写法是什么”吧!
正则表达式,又称规则表达式。它是计算机科学的一个概念。正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。
vue中的正则我们一般可以使用以下三种形式,前两种中每个输入框只能填写一个,如果我们是for循环出来的,我们使用第三种绑定module的形式。
<van-field v-model="createNameDataList.managementNamevalue" :placeholder="fieldTipsInfo.placeholder" clearable :maxlength="fieldTipsInfo.maxlength" onkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\.]/g,'')"/>
import Vue from "vue";function onInput(el, ele, binding, vnode) { function handle() { // 只保留数字 // ele.value = ele.value.replace(/[^\d]/g, ""); ele.value = ele.value.replace(/[^\d.]/g, ""); } return handle;}const numberInput = { bind(el, binding, vnode) { const ele = el.tagName === "INPUT" ? el : el.querySelector("input"); ele.addEventListener("input", onInput(el, ele, binding, vnode), false); }};Vue.directive("number-input", numberInput);
// 使用方法:// {/*1. import '../../api/Super/instruction/v-number-input'2. <van-field v-model="model" v-number-input></van-field> 3. data(){ model:""}*/}
vue 文件
<template> <div> <div id="textInput"> <van-field v-for="index in 10" :key="index" :input="test(index)" v-model="testData[index].model" ></van-field> </div> </div></template><style scoped></style><script>import regex from "../../tools/regular-expression/regex";export default { data() { return { testData: [], } }, mounted() { this.start(); }, methods: { start() { for (let index = 0; index < 12; index++) { this.testData.push({ model: "12345" }); } }, test(i) { this.testData[i].model = regex.isNumber(this.testData[i].model); } }};</script>
js文件
exprot default{
isNumber: function (str) { var reg = /[^\d.]/g; return str.replace(reg,""); }, /*是否带有小数*/ isDecimal: function (str) { var reg = /^\d+\.\d+$/; return str.replace(reg,""); }, /*校验是否中文名称组成 */ ischina: function (str) { var reg = /^[\u4E00-\u9FA5]{2,4}$/; /*定义验证表达式*/ return str.replace(reg,""); /*进行验证*/ }, /*校验是否全由8位数字组成 */ isStudentNo: function (str) { var reg = /^[0-9]{8}$/; /*定义验证表达式*/ return str.replace(reg,""); /*进行验证*/ }, /*校验电话码格式 */ isTelCode: function (str) { var reg = /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/; return str.replace(reg,""); }, /*校验邮件地址是否合法 */ IsEmail: function (str) { var reg = /^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/; return str.replace(reg,""); }}
/* 使用方法如下: import regex from "../../../tools/regular-expression/regex"; // 导入转移符html this.str = escape.isNumber(str) */
感谢各位的阅读,以上就是“Vue正则写法是什么”的内容了,经过本文的学习后,相信大家对Vue正则写法是什么这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是亿速云,小编将为大家推送更多相关知识点的文章,欢迎关注!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。