当前位置: 首页 > news >正文

element中el-input组件限制输入条件(数字、特殊字符)

1、只能输入纯数字

<el-input v-model="aaa" type="text" @input="(v)=>(aaa=v.replace(/[^\d]/g,''))" />

2、只能输入纯数字和小数(比如:6.66)

<el-input v-model="aaa" type="text" @input="(v)=>(aaa=v.replace(/[^\d.]/g,''))" />

3、禁止输入特殊字符

1. 在vue原型上定义全局方法

Vue.prototype.validForbid = function (value) { value = value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,./;'\\[\]·~!@#¥%……&*()——\-+={}|《》?:“”【】、;‘’,。、]/g, '').replace(/\s/g, ""); return value; }

2. 组件中使用、input调用该方法

<el-input :value="name" @input="e => name = validForbid (e)"></el-input>

4、只能输入数组和字母(A123456)

<el-input v-model="aaa"  @input="(v)=>(aaa = v.replace(/[^\a-\z\A-\Z0-9]/g, ''))" ></el-input>

5、数字类型限制的话可以使用el-input-number

<el-input-number v-model="a" placeholder="请输入" :controls="false"></el-input-number>

官方文档地址文档地址:

Element - The world's most popular Vue UI framework

参考资料:element中el-input组件限制输入条件(数字、特殊字符) - 掘金

相关文章:

element中el-input组件限制输入条件(数字、特殊字符)

1、只能输入纯数字 <el-input v-model"aaa" type"text" input"(v)>(aaav.replace(/[^\d]/g,))" /> 2、只能输入纯数字和小数&#xff08;比如&#xff1a;6.66&#xff09; <el-input v-model"aaa" type"text&quo…...

会议OA项目之会议发布(一)

目录 前言&#xff1a; 会议发布的产品原型图&#xff1a; 1.会议发布 1.1实现的特色功能&#xff1a; 1.2思路&#xff1a; 使用的数据库&#xff1a; 我们要实现多功能下拉框的形式选择可以参考原文档&#xff1a;https://hnzzmsf.github.io/example/example_v4.html#down…...

【Android】对象为null的一个原因:在方法内部,重新创建了一个新的对象并将其赋值给原对象,但这并不会改变原始的原对象的引用

疑问 现在有代码如下&#xff1a; private GameList multiGameList;/*** 获取多人游戏列表** return 多人游戏列表*/ public GameList getMultiGameList() {if (null multiGameList) {createMultiOrSingleGameList(multiGameList,GameList.TYPE_MULTI);}return multiGameLis…...

macbook 软件iMovie for Mac(专业视频剪辑工具)中文版

iMovie mac中文版是一款针对Mac平台量身定做的视频编辑工具&#xff0c;软件凭借流线型设计和直观的编辑功能&#xff0c;可以让您感受前所未有的方式制作好莱坞风格的预告片和精美电影&#xff0c;并且还可以浏览视频资料库&#xff0c;快速共享挚爱瞬间&#xff0c;创建精美的…...

web APIs-练习一

轮播图点击切换&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta http-equiv"X-UA-Compatible" content"IEedge" /><meta name"viewport" content"…...

AX88179A千兆网卡芯片,支持switch联网

AX88179是世界上第一个USB 3.0&#xff0c;千兆以太网控制器&#xff0c;它在单一芯片上集成了USB 3.0 PHY和10/100/1000Mbps千兆以太网MAC / PHY。AX88179是最新此外ASIX的USB-到-LAN产品组合&#xff0c;提供一个小的形式因素的解决方案和插头-和-打法可用性&#xff0c;使嵌…...

Pytorch个人学习记录总结 05

目录 神经网络的基本骨架 卷积操作 torch.nn.functional.conv2d 神经网络的基本骨架 搭建Neural Network骨架主要用到的包是torch.nn&#xff0c;官方文档网址&#xff1a;torch.nn — PyTorch 2.0 documentation&#xff0c;其中torch.nn.Module很重要&#xff0c;是所有所…...

windows部署安装redis安装教程

1、下载redishttps://github.com/tporadowski/redis/releases 2、下载完然后双击安装 比较简单 略过 3、测试是否安装成功 提示bug Warning: no config file specified, using the default config. In order to specify a config file use redis-server /path/to/redis.conf …...

Jmeter post请求传参问题

同线程组引用参数 新增数据bizId&#xff0c;然后将此次新增数据删除 添加新增数据接口&#xff0c;然后查询数据列表&#xff0c;正则表达式提取bizId 在删除接口引用此值${bizId} 添加断言&#xff0c;执行查看结果 json格式的post请求 摘要&#xff1a;正在执行的活动内容…...

对Windows应用程序进行代码签名

Windows上发布桌面应用程序&#xff0c;您可以看到带有“发布者&#xff1a;未知”的未正确签名的应用程序。 没有被签名的软件 因此&#xff0c;这里有一个有关经验教训的快速指南&#xff0c;可能会帮助您从一开始就正确签署安装程序。请注意&#xff0c;这些说明适用于对已…...

2022 China Open Source Report

| 翻译&#xff1a;黄绍雅、岳扬、刘文涛、李思颖 | 编辑&#xff1a;胡欣元 | 设计&#xff1a;胡欣元 As 2022 finally came to an end, we also emerged from the challenging years of the three-year-long COVID pandemic. The new edition of the "China Open Sourc…...

postgresql|数据库|启动数据库时报错:FATAL: could not map anonymous shared memory的解决

前言&#xff1a; 一个很偶然的出现的问题&#xff0c;因为我需要验证备份文件是否正确&#xff0c;因此&#xff0c;我在一台已启动了一个数据库实例的服务器上&#xff0c;依据全备的数据库文件在启动一个实例&#xff0c;当然&#xff0c;在此之前&#xff0c;已经修改了备…...

数字签名与数字证书

数字签名与数字证书 数字签名数字证书数字证书的原理数字证书的特点 如何验证证书机构的公钥不是伪造的 数字签名 数字签名是非对称密钥加密技术与数字摘要技术的应用&#xff0c;数字签名就是用加密算法加密报文文本的摘要&#xff08;摘要通过hash函数得到&#xff09;而生成…...

基于Jquery EasyUI JSZip FileSaver的简单使用

一、前言 在前端的项目开发中 &#xff0c;下载文件压缩包是很重要的一个环节&#xff0c;那么怎么下载多个文件并压缩成ZIP下载呢&#xff1f; 二、使用步骤 1、引用库 <script type"text/javascript" src"~/Scripts/comm/jszip.min.js" ></…...

git远程一个分支对应本地两个分支推送

git远程一个分支对应本地两个分支推送 你可以使用以下命令将两个本地分支推送到远程仓库中的一个远程分支&#xff1a; 首先&#xff0c;将第一个本地分支推送到远程仓库&#xff1a; git push <远程仓库名称> <本地分支名称>:<远程分支名称>例如&#xff…...

SpringCloud学习—Hystrix:服务熔断

分布式系统面临的问题: 复杂分布式结构中的应用程序有数十个依赖关系&#xff0c;每个依赖关系在某些时候将不可避免的失效. 服务雪崩 多个微服务之间调用的时候&#xff0c;假设微服务A调用微服务B和微服务C,微服务B和微服务C又调用其他的微服务&#xff0c;这就是所谓的“扇…...

8款常用系统镜像烧录软件

系统烧录软件是一种用于将操作系统或其他软件程序安装到嵌入式系统、嵌入式设备或存储设备中的工具。它通常用于将预先编译好的二进制文件或源代码烧录到硬件设备的非易失性存储器中&#xff0c;例如闪存芯片、EEPROM、EPROM或其他存储介质。系统烧录软件提供了一个便捷的方式&…...

设计模式什么情况下适合使用呢?

很多情况下设计模式是一种经过验证的解决特定问题的最佳实践。设计模式提供了一种标准化的方式来解决常见的软件设计问题&#xff0c;并提供了一种可重用的解决方案。设计模式可以帮助开发人员编写具有高可维护性、可扩展性和可重用性的代码。 设计模式适用于以下情况&#xf…...

Docker和K8s区别,使用场景,具体怎么使用以及详细命令

目录 一、Docker 和 Kubernetes 的区别二、Docker 的使用场景三、Kubernetes 的使用场景四、Docker 的具体使用方法五、Kubernetes 的具体使用方法 Docker 和 Kubernetes(简称 K8s) 都是容器技术领域中非常重要的工具&#xff0c;但它们在构建、部署和管理容器化应用程序方面发…...

K8S集群创建和管理,以及常用命令

目录 1. 安装 K8s 集群2. 创建 K8s 集群3. 管理 K8s 集群4. 维护 K8s 集群 K8s 集群 (Kubernetes Cluster) 是一个由多个节点组成的容器编排平台&#xff0c;它提供了一种简单、可靠、可扩展的方式来部署、管理和监控容器化应用程序。K8s 集群通常由一个或多个 Master 节点和一…...

多品种小批量时代的排产革命:JVS-APS智能排产突破交付周期瓶颈

"紧急订单插入&#xff0c;全产线排程推倒重来"、"设备冲突、物料短缺让排产计划沦为纸上谈兵"、"明明产能充足&#xff0c;订单交付周期却比同行长30%"——这些困境正在困扰着越来越多的制造企业。在现代制造业中&#xff0c;多品种小批量生产模…...

别再只盯着EMD了!滚动轴承故障诊断,试试VMD和MCKD这些新方法(附Python代码对比)

滚动轴承故障诊断&#xff1a;VMD与MCKD的实战对比与Python实现 滚动轴承作为旋转机械的核心部件&#xff0c;其健康状态直接影响设备运行安全。传统经验模态分解&#xff08;EMD&#xff09;虽广泛应用&#xff0c;但在处理强噪声和非平稳信号时存在明显局限。本文将深入解析变…...

Google 地图事件:探索、挑战与未来展望

Google 地图事件:探索、挑战与未来展望 引言 Google 地图作为全球最受欢迎的地图服务之一,自2005年推出以来,已经深入到人们生活的方方面面。然而,在这段时间里,Google 地图也经历了一系列事件,包括技术挑战、政策争议以及市场竞争等。本文将围绕这些事件,对 Google 地…...

毕业设计实战:基于SSM+JSP的家纺用品销售管理系统设计与实现全攻略

毕业设计实战&#xff1a;基于SSMJSP的家纺用品销售管理系统设计与实现全攻略 在开发“家纺用品销售管理系统”这套毕设时&#xff0c;我曾因“订单管理与商家库存脱节”踩过一个关键坑。初期设计时&#xff0c;我将“用户下单”和“商家库存扣减”视为两个独立操作&#xff0c…...

保姆级教程:在Ubuntu 22.04上从Anaconda到PyTorch,一步步搞定GPU环境(含CUDA 11.7避坑指南)

保姆级教程&#xff1a;在Ubuntu 22.04上从Anaconda到PyTorch&#xff0c;一步步搞定GPU环境&#xff08;含CUDA 11.7避坑指南&#xff09; 刚接触深度学习的开发者们&#xff0c;最头疼的往往不是模型设计本身&#xff0c;而是环境搭建这个"拦路虎"。本文将手把手带…...

深入解析Android系统分区:从启动到恢复的完整指南

1. Android系统分区基础认知 当你第一次拆解Android系统时&#xff0c;可能会被各种分区名称搞得晕头转向。其实这些分区就像我们电脑里的C盘、D盘一样&#xff0c;各自承担着不同的职责。我刚开始接触时也犯过糊涂&#xff0c;直到有次刷机把boot分区刷坏&#xff0c;手机直接…...

别再找插件了!手把手教你用uni-app的Canvas API画一个带渐变和刻度的环形进度条

原生Canvas魔法&#xff1a;在uni-app中打造高性能渐变环形进度条 每次看到那些酷炫的数据可视化图表&#xff0c;你是不是也想过自己动手实现&#xff1f;但面对复杂的第三方图表库文档和性能问题又望而却步。今天我要分享的是如何用uni-app原生Canvas API&#xff0c;从零开始…...

I2C总线协议实战:从零开始用Verilog实现一个I2C主设备(附完整代码)

I2C总线协议实战&#xff1a;从零开始用Verilog实现一个I2C主设备&#xff08;附完整代码&#xff09; 在嵌入式系统和FPGA开发中&#xff0c;I2C总线因其简单的两线制结构和灵活的多主设备支持&#xff0c;成为最常用的串行通信协议之一。本文将带您从零开始&#xff0c;用Ver…...

探秘HackGPT:一款强大的AI辅助开发工具

探秘HackGPT&#xff1a;一款强大的AI辅助开发工具 【免费下载链接】hackGPT I leverage OpenAI and ChatGPT to do hackerish things 项目地址: https://gitcode.com/GitHub_Trending/ha/hackgpt 在快速发展的科技领域&#xff0c;人工智能&#xff08;AI&#xff09;已…...

AMD Ryzen硬件调试指南:5分钟掌握SMUDebugTool核心功能

AMD Ryzen硬件调试指南&#xff1a;5分钟掌握SMUDebugTool核心功能 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table. 项目地址: https://g…...