element-ui限制输入框输入的数不小于0且整数位最多为5位小数位最多为两位

H@Z*rTE|i

已于 2023-02-09 09:52:07 修改

阅读量988

点赞数

分类专栏： vue2 vue3 金额数字格式化文章标签：前端 javascript vscode 前端框架 vue.js

于 2023-02-09 09:48:43 首次发布

本文链接：https://blog.csdn.net/IT13333/article/details/128947400

版权

vue2 同时被 3 个专栏收录

24 篇文章 1 订阅

订阅专栏

16 篇文章 0 订阅

订阅专栏

金额数字格式化

2 篇文章 0 订阅

订阅专栏

element-ui限制输入框输入的数不小于0且整数位最多为5位小数位最多为两位

<el-input v-model="input1" placeholder="请输入内容" @keyup.native="input1 = limitControlLine(input1,5,2)"></el-input>

limitControlLine (val,zs,xs) {
  let value = val;
  if (isNaN(val)) {
    value = String(val).replace(/[^\d.]/g, '') // 清除“数字”和“.”以外的字符
    value = value.replace(/\.{2,}/g, '.'); // 只保留第一个. 清除多余的
    value = value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.');
  }
  if (value.charAt(0) === '0' && val.charAt(1) !== '.') {
    value = "0";
  }
  if (value.charAt(0) === '.') {
    value = "0." + value.split('.')[1] ;
  }
  if (Number(value) >Math.pow(10,zs)) {
    value = (value.split('.')[1] === undefined) ? value.substr(0,zs): value.substr(0,zs) + "." + value.split('.')[1];
  }
  if(value.indexOf('.')>0){
    value=value.slice(0,value.indexOf('.')+ (xs + 1));
  }
  return value;
},

或

直接上正则也是OK

 let moneyReg = /^\d{1,8}(\.\d{1,2})?$/; //匹配金额格式 最大8位整数 + 2位小数 金额直接上正则
        if (!moneyReg.test(this.currentCount)) {
          this.$message.error('输入金额格式有误，请重新输入');
          return;
        }

2. element-ui限制只能输入 0 和负数（小数位最多2位，整数位最多5位）

<el-input v-model="input1" placeholder="请输入内容" @keyup.native="input1 = limitControlLine(input1,5,2)"></el-input>

limitControlLine (val,zs,xs) {
  let value = val;
  value = value.replace(/[^\-\d.]/g,''); // 只能输入负号、小数点和数字
  value = (value.length > 1) ? value.charAt(0) + value.substr(1).replace(/[^\d.]/g,'') : value; // 确保最多只能有一个负号
  if (value !== "0" && value !== "0." && value !== "00") {
    if (value.charAt(0) === "-") {
      value = value.replace(/\.{2,}/g, '.'); // 只保留第一个. 清除多余的
      value = value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.');
      //如果小数点前面是负号,则变成  -0.
      if (value.length > 1 && value.charAt(0) === "-" && value.charAt(1) === "." ) {
          value = (value.split('.') !== undefined) ? "-0." + value.split('.')[1] : "-";
      }
      // 不能出现 -00这种
      if (value.length > 2 && value.charAt(0) === "-" && value.charAt(1) === "0" && value.charAt(2) !== "." ) {
        value = "-" + value.substr(2);
      }
      // 限制整数位
      if (Number(value) < -Math.pow(10,zs)) {
        value = (value.split('.')[1] === undefined) ? value.substr(0,zs + 1): value.substr(0,zs + 1) + "." + value.split('.')[1];
      }
      // 限制小数位
      if(value.indexOf('.')>0){
        value=value.slice(0,value.indexOf('.')+ (xs + 1));
      }
    } else {
      value = "";
    }
  } else {
    value = "0";
  }
  return value;
},