input 只能输入正数并且只能保留3位小数且开头不能为0,并且表单多字段使用

checker.js

	export default {
	isNumber : function (checkVal){
		var reg = /^-?[1-9][0-9]?.?[0-9]*$/;
		return reg.test(checkVal);
	},
	    /**
	     * @description 小数点前后位数限制
		 * “当前输入的值”、“小数点前限制的位数”、“小数点后限制的位数”
	     */
	 limitByPoint: function(val, limitBeforePoint, limitAfterPoint) {
	   const pointNum = (val.includes(".") && val.match(/\./g).length) || 0; // 小数点数量
	   let limitValue = '0';
	   if (pointNum === 0) {
	     // 不包含小数点
	      // 移除开头的0,除非值只有一位且是0
	         val = val.replace(/^0+/, (m) => (m.length === val.length && m.length === 1 ? m : ''));
	         // 如果值仍然为0且长度大于1位,则设置为空字符串(或根据需要设置默认值)
	         if (val === '0' && val.length > 1) {
	           val = '';
	         }
	     if (val.length > limitBeforePoint) {
	       limitValue = val.substring(0, limitBeforePoint);
	     } else {
	       limitValue = val;
	     }
	   } else if (pointNum === 1) {
	     // 小数点数量为1
	     const pointIndex = val.indexOf("."); // 小数点所在位置的索引
	     const valueBeforePoint = val.substring(0, pointIndex); // 小数点前的数
	     const valueAfterPoint = val.substring(pointIndex + 1); // 小数点后的数
	     // 限制小数点前的位数
	     if (valueBeforePoint.length > limitBeforePoint) {
			 console.log(valueBeforePoint.substring(0, limitBeforePoint),valueAfterPoint)
	       limitValue = valueBeforePoint.substring(0, limitBeforePoint) + "." + valueAfterPoint;
			uni.showToast({
			  title: "请输入正确的值,小数点前的数值位数最大为"+limitBeforePoint+"位",
			  icon: "none",
			});
		 }
	 
	     // 限制小数点后的位数
	     if (valueAfterPoint.length > limitAfterPoint) {
	       limitValue = valueBeforePoint + "." + valueAfterPoint.substring(0, limitAfterPoint);
			uni.showToast({
			  title: "请输入正确的值,小数点位数只能保留"+limitAfterPoint+"位",
			  icon: "none",
			});
		 } else {
	       limitValue = val; // 如果没有超出小数点后的限制,则保持原值
	     }
	   } else {
	     // 小点数量大于1,属于错误值
	     uni.showToast({
	       title: "请输入正确的值",
	       icon: "none",
	     });
	     limitValue = ''; // 清空值或设置为默认值
	   }
	 
	   return limitValue;
	 }
}

在页面引用

<template>
<form>
<view class="uni-form-item">
				<view class="mb10px color-6a6a6a">核销借款</view>
				<input type="number" placeholder="请输入核销借款" v-model="form.unitPrice" @input="limitByPoint($event,'unitPrice',8,3)" />
			</view>
</form>
</template>
<script>
	import checker from "@/utils/checker.js"
	export default {
		data() {
			return {
			form: {
					id: null,
					unitPrice:0
				}
			}
		},
		methods: {
			// “当前输入的值”、“key名称”、“小数点前限制的位数”、“小数点后限制的位数”,
			limitByPoint(event, formVal,beforNum,afterNum) {
				let val = graceChecker.limitByPoint(event.detail.value, beforNum, afterNum)
				this.$nextTick(() => {
				  this.form[formVal]=val
				})
			}
		}
}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/574252.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

从0到1—POC编写基础篇(四)

接着上一篇 cprint 模块 Python内置的 print 函数可以输出任何类型的数据&#xff0c;但有时候输出的内容不够简洁、美观&#xff0c;难以直观地了解程序运行状态。cprint 库就是为了解决这个问题而生的&#xff0c;它可以让Python输出更简洁、更美观。 cprint 库是一个基于装…

ubuntu20.04开机运行java的sh脚本

用到了 rc.local 1、修改 /usr/lib/systemd/system/rc-local.service 在最下面添加 [Install] WantedBymulti-user.target 2、 系统没有 rc.local&#xff0c;需要手动创建 cd /etc vi rc.local在里面写入 /opt/start.sh chmod x /etc/rc.local # 添加可执行权限 chmod x…

基于51单片机空气质量监测报警仿真LCD1602液晶显示( proteus仿真+程序+设计报告+原理图+讲解视频)

基于51单片机空气质量监测报警仿真LCD显示 1. 主要功能&#xff1a;2. 讲解视频&#xff1a;3. 仿真设计&#xff1a;4. 程序代码5. 设计报告6. 原理图7. 设计资料内容清单&&下载链接 基于51单片机空气质量监测报警仿真LCD显示( proteus仿真程序设计报告原理图讲解视频…

前端CSS基础10(浮动)

前端CSS基础10&#xff08;浮动&#xff09; 浮动元素浮动后的特点浮动后的特点浮动后的影响及解决 浮动布局小练习 浮动 CSS中的浮动是一种布局技术&#xff0c;常用于实现元素的排列和定位。通过使用float属性&#xff0c;可以让元素在页面中左浮动或右浮动&#xff0c;使得…

ubuntu18.04系统编译openwrt21.02.3

搭建ubuntu18.04环境 使用虚拟机安装ubuntu环境网上教程很多&#xff0c;这里不做赘述&#xff0c;主要是安装一些我们在编译openwrt时可能会用到的一些工具环境 sudo apt-get update sudo apt instll libncurses-dev gawk sudo apt-get install build-essential libncurses5…

pytest数据驱动DDT(数据库/execl/yaml)

常见的DDT技术 数据结构&#xff1a; 列表、字典、json串 文件&#xff1a; txt、csv、excel 数据库&#xff1a; 数据库链接 数据库提取 参数化&#xff1a; pytest.mark.parametrize() pytest.fixture() …

2023年图灵奖揭晓,Avi Wigderson成为双冠王

文章目录 Avi Wigderson双冠王个人简介约翰纳什致敬 Avi Wigderson 2024年4月10日&#xff0c;ACM宣布Avi Wigderson为2023年ACM A.M.图灵奖获得者&#xff0c;以表彰他对计算理论的基础性贡献&#xff0c;包括帮助我们重新理解随机性在计算中的作用&#xff0c;以及他在理论计…

第一届长城杯半决赛wp和AWD笔记

目录 AWD 渗透 cfs 单节点1 AWD笔记 AWD工具 文件比较工具 Web漏洞扫描工具 waf工具 代码审计工具 批量网站备份文件泄露扫描工具 cms通杀漏洞的利用 通杀脚本和批量提交flag脚本 防御流程 攻击流程 注意 AWD 解题思路] 首先就是fscan快速扫描对应C段&#xf…

【Qt 学习笔记】Qt常用控件 | 显示类控件 | LCD Number的使用及说明

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;Qt 专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ Qt常用控件 | 显示类控件 | LCD Number的使用及说明 文章编号&#xf…

贪吃蛇的C语言实现

目录 一、游戏流程设计 二、游戏实现原理 2.1如何创建并管理数据 2.2如何实现蛇身移动 2.3如何实现食物随机放置 2.4如何检测按键与调整光标位置 三、源代码 3.1 test.c 3.2 snake.h 3.3 snake.c 一、游戏流程设计 GameStart WelcomeToGame&#xff1a;打印欢迎界面…

架构师系列-消息中间件(九)- RocketMQ 进阶(三)-消费端消息保障

5.2 消费端保障 5.2.1 注意幂等性 应用程序在使用RocketMQ进行消息消费时必须支持幂等消费&#xff0c;即同一个消息被消费多次和消费一次的结果一样&#xff0c;这一点在使用RoketMQ或者分析RocketMQ源代码之前再怎么强调也不为过。 “至少一次送达”的消息交付策略&#xff…

开启医疗数据新纪元:山海鲸可视化智慧医疗解决方案

在数字化浪潮席卷而来的今天&#xff0c;智慧医疗作为医疗行业的创新力量&#xff0c;正以其独特的技术优势&#xff0c;推动着医疗服务的升级和变革。而在这场变革中&#xff0c;山海鲸可视化以其出色的数据可视化能力&#xff0c;为智慧医疗提供了强大的技术支持&#xff0c;…

用Python和Pygame实现简单贪吃蛇游戏

1.pip安装pygame pygam插件安装 pip install 插件名字 # 安装 pip uninstall 插件名字 # 卸载 pip install 插件名字 -i 指定下载的镜像网址 pip show 插件名字 # 查看插件名字 pip install pygame -i https://pypi.tuna.tsinghua.edu.cn/simple pip show p…

【网络编程】网络编程概念 | TCP和UDP的区别 | UDP数据报套接字编程 | Socket

文章目录 网络编程一、什么是网络编程1.TCP和UDP的区别 二、UDP数据报套接字编程DatagramSocketDatagramPacket回显服务器&#xff08;echo server&#xff09; 网络编程 一、什么是网络编程 通过网络&#xff0c;让两个主机之间能够进行通信。基于通信来完成一定的功能。 ​…

MacOS 下gif 文件的几种压缩方法

categories: Tips tags: Tips GIF 写在前面 最近想转换几个 tg 的 tgs 文件到 gif, 然后上传到微信, 所以又涉及到了 gif 的操作了. 工具介绍 安装 brew install imagemagick gifsicleimagemagick 是专业的图像处理工具, gifsicle 是专门处理 gif 的小工具 ,都是开源的. …

C++之AVL树的使用以及原理详解

1.AVL树 1.1AVL树的概念 1.2AVL树的定义 1.3AVL树的插入 1.4AVL树的旋转 1. 右单旋 2. 左单旋 3. 左右双旋 4. 右左双旋 1.5AVL树的验证 1.6AVL的实现 在之前对map/multimap/set/multiset进行了简单的介绍&#xff08;C之map_set的使用-CSDN博客&#xff09;&#xff0c;…

说说2024年暑期三下乡社会实践工作新闻投稿经验

作为一名在校大学生,我有幸自去年起参与学院组织的暑期大学生三下乡社会实践团活动。这项活动不仅是我们深入基层、服务社会的重要平台,也是展现当代大学生风采、传递青春正能量的有效途径。然而,如何将这些生动鲜活的实践故事、感人至深的瞬间传播出去,让更多人了解并受到启发…

火绒安全的应用介绍

火绒安全软件是一款集成了杀毒、防御和管控功能的安全软件&#xff0c;旨在为用户提供全面的计算机安全保障。以下是火绒安全软件的一些详细介绍&#xff1a; 系统兼容性强&#xff1a;该软件支持多种操作系统&#xff0c;包括Windows 11、Windows 10、Windows 8、Windows 7、…

xgp加速器免费 微软商店xgp用什么加速器

2001年11月14日深夜&#xff0c;比尔盖茨亲自来到时代广场&#xff0c;在午夜时分将第一台Xbox交给了来自新泽西的20岁年轻人爱德华格拉克曼&#xff0c;后者在回忆中说&#xff1a;“比尔盖茨就是上帝。”性能超越顶级PC的Xbox让他们趋之若鹜。2000年3月10日&#xff0c;微软宣…

25-代码随想录第454题.四数相加II

25-代码随想录第454题.四数相加II 给定四个包含整数的数组列表 A , B , C , D ,计算有多少个元组 (i, j, k, l) &#xff0c;使得 A[i] B[j] C[k] D[l] 0。 为了使问题简单化&#xff0c;所有的 A, B, C, D 具有相同的长度 N&#xff0c;且 0 ≤ N ≤ 500 。所有整数的范…
最新文章