美文网首页
el-input限制用户强制输入正整数或保留两位小数

el-input限制用户强制输入正整数或保留两位小数

作者: Angrybird233 | 来源:发表于2021-07-13 19:35 被阅读0次

1.限制只能输入正整数(1-99999)

template
  el-input(v-model="number1",
    clearable,
    size="small",
    maxlength="5"
    @input="validateNumber"
    placeholder="请输入1-99999之间的整数")

export default {
  data() {
    return {
      number1: "",
    }
  },
  methods: {
    // 限制正整数输入
    validateNumber(value) {
      value = value.replace(/[^0-9]/g, "");
      if (value.indexOf(0) == 0) {
        value = "";
      }    
    }
  }
}

2.限制只能输入数字或小数点(两位小数)

template
  el-input(v-model="number2",
    clearable,
    size="small",
    maxlength=""
    @input="validateNumber"
    placeholder="")

export default {
  data() {
    return {
      number2: "",
    }
  },
  methods: {
    // 限制只能输入数字或小数点
    validateNumber(value) {
      value = value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g, "");
      value = value.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
      if (value.indexOf(".") !== value.lastIndexOf(".")) {
        const index = value.lastIndexOf(".");
        value = value.substr(0, index);
      }
    }
  }
}

相关文章

网友评论

      本文标题:el-input限制用户强制输入正整数或保留两位小数

      本文链接:https://www.haomeiwen.com/subject/rexzgktx.html