uniapp小程序,输入框限制输入(正整数、小数后几位)

html 复制代码
  <uv-input inputAlign="right" type="number" v-model="quantity" placeholder="请输入单价"
    border="none" @input="e => handleInput(e, 2)"/>
javascript 复制代码
const quantity = ref()
const handleInput = (e, decimals) =>{
  //setTimeout解决input不及时更新
  setTimeout(() => {
    quantity = handleNumberInput(e, decimals)
  }, 0)
}
/**
 * 处理数字输入
 */
 function handleNumberInput (
  e: string | number /**输入的值 */,
  decimals: number = 2 /**小数点位数 */
) => {
  if (e === "") return;
  let result = "";
  result = String(e);
  // 只能输入正整数
  if (!decimals) {
    return (
      result
        // 第一步:去除非数字和小数点
        .replace(/[^\d.]/g, "")
        // 第二步:替换开头的0、所有非数字字符、所有小数点
        .replace(/^0|[^\d]|[.]/g, "")
    );
  }
  // 处理小数位数
  if (decimals > 0) {
    const decimalRegex = new RegExp(`(\\.\\d{${decimals}})\\d+$`, "g");
    result = result
      // 第一步:去除非数字和小数点
      .replace(/[^\d.]/g, "")
      // 第二步:处理前导0(非零开头的数字)
      .replace(/^0+(\d)/, "$1")
      // 第三步:处理开头单独的小数点,转为0.
      .replace(/^\./, "0.")
      // 第四步:保留第一个小数点,去掉多余的
      .replace(/\./g, (s, offset, str) =>
        offset === str.indexOf(".") ? s : ""
      )
      // 第五步:截断小数部分到decimals位
      .replace(decimalRegex, "$1")
      // 第六步:处理整数部分的前导0(比如0后面没有小数点的情况)
      .replace(/^0+([1-9])/, "$1")
      // 确保精确到指定位数
      .replace(new RegExp(`(\\.[\\d]{${decimals}}).*$`), "$1"); 
  }
  return result;
};
相关推荐
说私域38 分钟前
社群经济下开源链动2+1模式AI智能名片S2B2C商城小程序的信任重构机制研究
人工智能·小程序·重构
说私域10 小时前
开源AI智能名片链动2+1模式S2B2C商城小程序FAQ设计及其意义探究
人工智能·小程序
小小王app小程序开发10 小时前
短剧小程序 2025 核心痛点分析:内容、技术与合规的三重困境
小程序
276695829213 小时前
朴朴超市小程序分析
java·python·小程序·node·sign·朴朴超市·sign-v2
低代码布道师13 小时前
医疗小程序04添加就诊人
低代码·小程序
带着梦想扬帆启航13 小时前
UniApp 全局使用字体教程
css·uni-app
Best13 小时前
uniapp 微信小程序记录
微信小程序·小程序·uni-app
shykevin15 小时前
uni-app x开发商城系统,商品列表点击跳转至商品详情页
windows·uni-app
蜕变菜鸟15 小时前
PC网站和uniapp安卓APP、H5接入支付宝支付
uni-app
蒲公英源码15 小时前
基于PHP+Vue+小程序快递比价寄件系统
vue.js·小程序·php