实现输入框只能输入数值，且限制小数位数

最终实现效果：不可输入数字和小数点以外的,且不能多次输入小数点，输入小数位数超过限制的话将不允许再往后输入

 

// 监听可输入小数的数字输入框的 input事件

// 参数一value,输入的值，参数二obj,监听的对象，参数三prop,监听的属性

export function floatInputChange(value, obj, prop) {

  if (!obj || !prop || !value) {

    return

  }

  // 不允许只输入小数点

  if (value === '.') {

    obj[prop.toString()] = ''

    return

  }

  // 不可输入数字和小数点以外的,且不能多次输入小数点

  obj[prop.toString()] = value.replace(/[^0-9.]/g, '').replace(/(\.)(\d*)(\1*)/g, '$1$2')

  const Decimals = obj[prop.toString()].split('.')[1]

  // 输入小数位数超过限制的话，截取前面几位

  // floatDigit是项目中配置文件中的小数位数变量

  if (Decimals && Decimals.length > floatDigit) {

    obj[prop.toString()] = obj[prop.toString()].substring(0, obj[prop.toString()].indexOf('.') + floatDigit + 1)

  }

}

注意事项：

只能监听el-input输入框的input事件，el-input-number组件的input事件拿不到当前输入框的值，只能拿到此次输入的一个字符，且该组件input事件不会一输入值就触发，触发时机跟change事件一致