首页 > 其他分享 >Vue中form表单常用rules校验规则

Vue中form表单常用rules校验规则

时间:2024-04-27 09:55:17浏览次数:20  
标签:25 Vue false form rules value callback test const

是否合法IP地址

const checkIPCode = (rule, value, callback) => {
		if (/^(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])$/
			.test(value) == false) {
			callback(new Error("请输入正确的ip地址"));
		} else {
			callback();
		}
	}

是否合法端口

const checkPortCode = (rule, value, callback) => {
		if (/^([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-4]\d{4}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/.test(value) == false) {
			callback(new Error("请输入正确的端口号"));
		} else {
			callback();
		}
	}

标签:25,Vue,false,form,rules,value,callback,test,const
From: https://www.cnblogs.com/leepandar/p/18161752

相关文章

  • vue箭头函数、js-for循环、事件修饰符、摁键事件和修饰符、表单控制、完整购物车版本
    【箭头函数】1<!DOCTYPEhtml>2<htmllang="en">3<head>4<metacharset="UTF-8">5<title>Title</title>6<scriptsrc="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">&l......
  • vue3 快速入门系列 —— 状态管理 pinia
    其他章节请看:vue3快速入门系列Piniavue3状态管理这里选择pinia。虽然vuex4已支持Vue3的CompositionAPI,但是vue3官网推荐新的应用使用pinia——vue3pinia集中式状态管理redux、mobx、vuex、pinia都是集中式状态管理工具。与之对应的就是分布式。Pinia符......
  • vue3打包js内存溢出
     第一步:npminstall-gincrease-memory-limit第二步:npminstallincrease-memory-limit—save-dev第三步:package.json文件中修改   "build:win32":"cross-envLIMIT=2048increase-memory-limitBUILD_TARGET=win32node.electron-vue/build.js",//添加这个......
  • Vue3.0
    Vue2中的optionsAPI和Vue3.0中compositionAPIoptionsAPI示例compositionAPI是一组基于函数的API,可以更灵活的组织组件的逻辑createAPP函数的第一个参数即compositionAPI对象用于创建应用实例createApp({setup(){ constcount=ref(0)return{......
  • 基于Vue 2的前端如何引入评论区组件Artalk
    1.Artalk介绍Artalk是一个可以集成的评论区组件,可以直接添加到前端页面,而不用自己开发评论区来保存评论,支持点赞/踩,还支持评论区之间的相互回复,以及一些表情包的使用,同时也有丰富的后台管理页面【如以下展示】[========]2.Artalk服务器部署2.1环境条件Vue2Artalk2.8......
  • The "TypeScript Vue Plugin (Volar)" extension is no longer needed since v2. Plea
    这个报错信息表明你正在使用的是VisualStudioCode或者其他支持Volar的编辑器,而Volar是一个为Vue3应用提供TypeScript支持的工具。这个报错指出自从Volar版本2开始,"TypeScriptVue插件(Volar)"这个扩展就不再需要了。解决方法:如果你在使用的是VisualStudioCode编辑器,并且安装......
  • 《Vue.js设计与实现》 第八章 挂载与更新
    8.1挂载子节点和元素的属性8.2HTMLAttributes与DOMProperties8.3正确地设置元素属性8.4class的处理8.5卸载操作8.6区分vnode的类型8.7事件的处理8.8事件冒泡与更新时机问题8.9更新子节点8.10文本节点和注释节点8.11Fragment......
  • Java面试题:SimpleDateFormat是线程安全的吗?使用时应该注意什么?
    在日常开发中,我们经常会用到时间,我们有很多办法在Java代码中获取时间。但是不同的方法获取到的时间的格式都不尽相同,这时候就需要一种格式化工具,把时间显示成我们需要的格式。最常用的方法就是使用SimpleDateFormat类。这是一个看上去功能比较简单的类,但是,一旦使用不当也有可能导......
  • 模仿实现Vue的双向绑定
    简单模仿Vue的单项绑定和双向绑定,可以解析v-bind和v-mode标签<!DOCTYPEhtml><html> <head> <metacharset="UTF-8"/> <title>模拟Vue单向绑定和双向绑定</title> </head> <body> <divid="app"> <inputtype=&......
  • VUE Element Plus-table动态添加删除行
     <template><divclass="app-container"><el-rowstyle="margin-top:20px"><el-col:span="24"style="border-left:5pxsolid#1d6ced;margin-bottom:10px"><labelstyle=......