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

el-input限制输入数字,输入中文后数字校验失效

想要的效果:默认值为0,只能输入0-100的数字。

实现方式如下,使用 οnkeyup="this.value=this.value.replace(/\D/g,‘’)"限制只能输入数字,输入数字没有问题,使用@input实现数字不以0开头,也只能是0-100。但是当输入汉字时,确实没有显示上去,再输入数字能正常显示输入,但是校验不起作用了,超100的数字也能输入。

<el-input v-model="num1" maxlength="3"  onkeyup="this.value=this.value.replace(/\D/g,'')" @input="rowNumSingle"/>
rowNumSingle(value ) {
if (value === '0' || !value.startsWith('0')) {this.num1 = value} else {// 以0开头this.num1 = value[0] === '0' ? '0' : value.replace(/^0+/, '')}// 最大100this.num1 = Math.min(100, Math.max(0, value))
}

修改后的实现:先判断是否为数字,不是数字直接设为初始值0,否获取输入的数字并赋值

<el-input v-model="num1"  maxlength="3"  @input="rowNumSingle" />
if(isNaN(Number(value)) || value === '' ){this.num1 = 0return}const newValue = Number(value)this.num1 = newValue// 最大100this.num1 = Math.min(100, Math.max(0, newValue))

相关文章:

el-input限制输入数字,输入中文后数字校验失效

想要的效果&#xff1a;默认值为0&#xff0c;只能输入0-100的数字。 实现方式如下&#xff0c;使用 οnkeyup"this.valuethis.value.replace(/\D/g,‘’)"限制只能输入数字&#xff0c;输入数字没有问题&#xff0c;使用input实现数字不以0开头&#xff0c;也只能是…...

26考研——数据的表示和运算_整数和实数的表示(2)

408答疑 文章目录 二、整数和实数的表示1、整数的表示1.1、无符号整数的表示1.2、有符号整数的表示1.3、C 语言中的整数类型及类型转换1.3.1、C 语言中的整型数据类型1.3.2、有符号数和无符号数的转换1.3.3、不同字长整数之间的转换 2、实数的表示2.1、浮点数的相关概念2.2、浮…...

用 Lazarus IDE 写一个邮件客户端软件,能收发邮件,编写邮件

下面是一个使用Lazarus IDE开发的基本邮件客户端实现方案&#xff0c;包含收发邮件和编写邮件的核心功能。我们将使用Synapse库&#xff08;跨平台的网络通信库&#xff09;来处理邮件协议。 步骤1&#xff1a;安装依赖 安装Synapse库&#xff1a; 下载地址&#xff1a;https:…...

关于智能体API参考接口

关于智能体在Flask的源码&#xff1a;请求体(在payload里的是请求体)、请求头&#xff08;在headers里的i局势请求头&#xff09;。 我的例子&#xff1a; 我的疑问&#xff1a;为什么没按Coze官方API文档格式&#xff0c;在Apifox里发POST请求却能收到回复&#xff1f; 1. 你…...

命令行运行python程序报错 ImportError: /lib/x86_64-linux-gnu/libstdc++.so.6

命令行运行python程序报错 ImportError: /lib/x86_64-linux-gnu/libstdc.so.6 ImportError: /lib/x86_64-linux-gnu/libstdc.so.6: version GLIBCXX_3.4.29’ not found (required by /home/zitong/miniconda3/envs/torch112/lib/python3.9/site-packages/scipy/spatial/_ckdt…...

直角坐标系和斜角坐标系

前情概要 笛卡尔坐标系是直角坐标系和斜角坐标系的统称。为什么会有这两种坐标系呢&#xff0c;教材中为什么最后只用直角坐标系呢&#xff1f;我们这样解释&#xff1a; 研究一维空间中的向量时&#xff0c;由于一维空间中的向量有无数条&#xff0c;如果我们选定一条作为基…...

vmware 设置 dns

vmware 设置 dns 常用的 DNS&#xff08;Domain Name System&#xff09;服务器地址可以帮助你更快、更安全地解析域名。以下是一些国内外常用的公共 DNS 服务&#xff1a; 国内常用 DNS 阿里云 DNS IPv4: 223.5.5.5、223.6.6.6IPv6: 2400:3200::1、2400:3200:baba::1特点&am…...

基于单片机的病房呼叫系统(源码+仿真)

该系统由以 STM32F4 为平台的监控终端以及以 CC2530 为平台的无线传感网组成。系统上电后自动完成 ZigBee 网络的组建、终端节点的加入&#xff0c;病人可利用便携式的病人终端发出呼叫求助请求信息、节点在线信息以及对护士的服务评价信息等&#xff0c;这些信息通过路由节点发…...

React从基础入门到高级实战:React 实战项目 - 项目四:企业级仪表盘

React 实战项目&#xff1a;企业级仪表盘 欢迎来到 React 开发教程专栏 的第 29 篇&#xff01;在前 28 篇文章中&#xff0c;我们从 React 的基础概念逐步深入到高级技巧&#xff0c;涵盖了组件设计、状态管理、路由配置、性能优化和实时通信等核心内容。这一次&#xff0c;我…...

基于微信小程序的睡眠宝系统源码数据库文档

摘 要 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;睡眠宝系统被用户普遍使用&#xff0c;为方便用户能够可以…...

VibePlayer

源代码地址&#xff1a; VibePlayer: VibePlayer是一款功能强大的Android音乐播放器应用&#xff0c;专为音乐爱好者设计&#xff0c;提供了丰富的音乐播放和管理功能。 用户需求 VibePlayer是一款功能强大的Android音乐播放器应用&#xff0c;专为音乐爱好者设计&#xff0…...

【汇编逆向系列】三、函数调用包含单个参数之float类型-xmm0寄存器,sub,rep,stos,movss,mulss,addss指令

一、汇编代码 single_float_param:0000000000000060: F3 0F 11 44 24 08 movss dword ptr [rsp8],xmm00000000000000066: 57 push rdi0000000000000067: 48 83 EC 10 sub rsp,10h000000000000006B: 48 8B FC mov …...

JAVA开发工具——IntelliJ IDEA

JAVA开发工具——IntelliJ IDEA 软件下载地址https://www.jetbrains.com/idea/ IDEA项目结构介绍 项目&#xff08;project&#xff09;模块&#xff08;module&#xff09;包&#xff08;package&#xff09;类&#xff08;class) 包含关系&#xff1a;项目 > 模块 >…...

基于fpga的疲劳驾驶检测

基于fpga的疲劳驾驶检测 前言一、系统硬件设计二、系统软件设计系统上板实验测试 前言 代码基于网络大佬代码进行修改的。限制性比较大&#xff0c;不太灵活&#xff0c;当个本科毕业设计还是够的。 基于FPGA的疲劳检测模块硬件设计以FPGA核心控制模块为中心&#xff0c;通过…...

感谢阿里云RDS产品及时的“光速服务”

❝ 开头还是介绍一下群&#xff0c;如果感兴趣PolarDB ,MongoDB ,MySQL ,PostgreSQL ,Redis, OceanBase, Sql Server等有问题&#xff0c;有需求都可以加群群内有各大数据库行业大咖&#xff0c;可以解决你的问题。加群请联系 liuaustin3 &#xff0c;&#xff08;共3000人左右…...

从零开始打造 OpenSTLinux 6.6 Yocto 系统(基于STM32CubeMX)(十一)

下载buildroot https://buildroot.org/download.html下载交叉工具链 使用ST官方交叉工具链的话&#xff0c;在buildroot配置外部工具会有问题&#xff0c;所以直接使用正点原子的交叉编译工具 buildroot构建根文件系统 - 参考正点原子 配置 buildroot tar -vxf buildroot-20…...

18-Oracle 23ai JSON二元性颠覆传统

在当今百花齐放的多模型数据库时代&#xff0c;开发人员常在关系型与文档型数据库间艰难取舍。Oracle Database 23ai推出的JSON关系二元性&#xff08;JSON Relational Duality&#xff09;​​ 和二元性视图&#xff08;Duality Views&#xff09;​​ 创新性地统一了两者优势…...

Linux68 FTP 测试 上传下载

6.在vi编辑器里&#xff0c;哪个命令能将光标移到第200行&#xff1f;&#xff08; B &#xff09; 7.A、200g B、:200 C、g200 D、G200 假如您需要找出 /etc/my.conf 文件属于哪个包 (package) &#xff0c;您可以执行&#xff08; D &#xff09;C A、 rpm -q /etc/my.co…...

山东大学《数据可视化》期末复习宝典

&#x1f308; 个人主页&#xff1a;十二月的猫-CSDN博客 &#x1f525; 系列专栏&#xff1a;&#x1f3c0;山东大学期末速通专用_十二月的猫的博客-CSDN博客 &#x1f4aa;&#x1f3fb; 十二月的寒冬阻挡不了春天的脚步&#xff0c;十二点的黑夜遮蔽不住黎明的曙光 目录 1…...

【Elasticsearch】映射:Join 类型、Flattened 类型、多表关联设计

映射&#xff1a;Join 类型、Flattened 类型、多表关联设计 1.Join 类型1.1 主要应用场景1.1.1 一对多关系建模1.1.2 多层级关系建模1.1.3 需要独立更新子文档的场景1.1.4 文档分离但需要关联查询 1.2 使用注意事项1.3 与 Nested 类型的区别 2.Flattened 类型2.1 实际运用场景和…...

SpringBoot十二、SpringBoot系列web篇之过滤器Filte详解

一、前言 JavaWeb三大组件Servlet、Filter、Listener&#xff0c;其中之一便是过滤器Filter。 其实&#xff0c;Filter我们平常用的不多&#xff0c;一般多为项目初期搭建web架构的时候使用&#xff0c;后面用的就少了&#xff0c;在日常业务开发中不太可能碰到需要手写Filte…...

【RTSP从零实践】1、根据RTSP协议实现一个RTSP服务

&#x1f601;博客主页&#x1f601;&#xff1a;&#x1f680;https://blog.csdn.net/wkd_007&#x1f680; &#x1f911;博客内容&#x1f911;&#xff1a;&#x1f36d;嵌入式开发、Linux、C语言、C、数据结构、音视频&#x1f36d; &#x1f923;本文内容&#x1f923;&a…...

行为设计模式之Iterator(迭代器)

行为设计模式之Iterator&#xff08;迭代器&#xff09; 摘要&#xff1a; 迭代器模式(Iterator)是一种行为设计模式&#xff0c;它提供顺序访问聚合对象元素的方法&#xff0c;同时不暴露内部结构。该模式由迭代器接口(Iterator)、具体迭代器(ConcreteIterator)、聚合接口(Ag…...

FPGA点亮ILI9488驱动的SPI+RGB接口LCD显示屏(一)

FPGA点亮ILI9488驱动的SPIRGB接口LCD显示屏 ILI9488 RGB接口初始化 目录 前言 一、ILI9488简介 二、3线SPI接口简介 三、配置寄存器介绍 四、手册和初始化verilog FPGA代码 总结 前言 ILI9488是一款广泛应用于嵌入式系统和电子设备的彩色TFT LCD显示控制器芯片。本文将介…...

​​​​​​​6板块公共数据典型应用场景【政务服务|公共安全|公共卫生|环境保护|金融风控|教育科研]

1. 政务服务 1.1 城市规划与管理 公共数据在城市规划与管理中可发挥关键作用。通过汇聚自然资源、建筑物、人口分布等基础数据,构建数字孪生城市模型,辅助城市总体规划编制、决策仿真模拟。在城市基础设施建设、安全运营、应急管理等方面,公共数据也是不可或缺的基础支撑。例…...

如何实现本地mqtt服务器和云端服务器同步?

有时候&#xff0c;一个物联网项目&#xff0c;A客户想要本地使用&#xff0c;B客户想要线上使用&#xff0c;C客户想要本地部署&#xff0c;当有网环境时能线上使用。这个时候就需要本地MQTT服务和线上MQTT服务能相互自动转发。 后来经我一翻研究&#xff0c;其实Activemq支持…...

windows10下搭建nfs服务器

windows10下搭建nfs服务器 有参考这篇博客 Windows10搭建NFS服务 - fuzidage - 博客园 下载 NFS Server这个app 通过网盘分享的文件&#xff1a;nfs1268 (1).exe 链接: https://pan.baidu.com/s/1rE4h710Uh-13kWGXvjkZzw 提取码: mwa4 --来自百度网盘超级会员v5的分享 下载后…...

CSS中justify-content: space-between首尾贴边中间等距(两端元素紧贴左右边缘,中间元素等距均匀分布)

justify-content: space-between; 是 CSS Flexbox 布局中的一个属性值&#xff0c;主要作用是在弹性容器的主轴方向上均匀分布子元素&#xff0c;具有以下核心特性&#xff1a; 作用效果&#xff1a; 首尾贴边 第一个子元素紧贴容器起始端 最后一个子元素紧贴容器结束端 中…...

【知识扫盲】分布式系统架构或分布式服务中的管理面,数据面和业务面

&#x1f9e9; 一、三大“面”的定义与职责&#xff08;以大模型推理平台为例&#xff09; 层级英文名职责关键组件举例数据面Data Plane处理用户请求、模型推理、输入输出数据转换等核心任务模型服务引擎、Tokenizer/Detokenizer、推理加速器&#xff08;TensorRT、ONNX Runt…...

华为云Flexus+DeepSeek征文|Dify - LLM 云服务单机部署大语言模型攻略指南

前言&#xff1a;在当今人工智能快速发展的时代&#xff0c;华为云推出的 Dify - LLM 对话式 AI 开发平台为企业和开发者提供了便捷的大语言模型应用开发解决方案。 通过在华为云 Flexus 云服务器上单机部署 Dify&#xff0c;并成功集成 DeepSeek 模型&#xff0c;我们能够快速…...