前端vue+uniapp关于输入内容正则表达式判断

最新推荐文章于 2023-10-23 16:41:43 发布

LYH--宇航

最新推荐文章于 2023-10-23 16:41:43 发布

阅读量2.3k

点赞数

分类专栏：项目解决方案文章标签：前端正则表达式 vue.js

本文链接：https://blog.csdn.net/weixin_44459831/article/details/123159745

版权

项目解决方案专栏收录该内容

6 篇文章 0 订阅

订阅专栏

关于对输入内容正则表达式判断Vue+uniapp

			//方法名
			testt(){
      			 //要做验证的正则表达式
				const reg = /^[\u4e00-\u9fa5]+$/;
				//判断是否输入值是否通过了正则表达式
     			 if(reg.test("具体要判断的参数")){
					console.log("通过正则验证");
				}else{
					console.log("未通过正则验证")
				}
			},

例为uniapp代码，vue方法同理即可


<template>
	<view>
		<view class="page">
			<uni-easyinput type="number" maxlength="11" style="width: 60%; left: 20%; height: 20rpx;" v-model="content"
				placeholder="请输入要绑定手机号">
			</uni-easyinput>
		</view>
		<u-button class="button" style="position:absolute; bottom:0px; width:100%" type="primary" text="保存信息"
			@click="verifyNum">保存信息
		</u-button>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				content: "",
			}
		},
		methods: {
			verifyNum() {
				//正则表达式
				const reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
				if (this.content == "") {
					uni.showToast({
						icon: "none",
						title: "请输入手机号！",
					});
				} else {
					//判断是否输入的是手机号
					if (reg.test(this.content)) {
						console.log("通过正则验证");
						uni.navigateTo({
						  url: "../attestation/embedded",
						});
					} else {
						uni.showToast({
							icon: "none",
							title: "您输入的手机号格式有误,请重新输入！",
						});
						this.content = "";
					}
				}

			},
		}
	}
</script>
<style>
</style>