vue input 自动补0,配合正则校验

贴几个关键代码

JS

// 金额校验
export function validatorCost(value) {
  if(!(/^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/.test(value))){
    return false
  }

  return true
}

// 补0
export function toDecimal(num){
  // console.log("num === ", num)
  if(num === 0 || num === "" || num === null || isNaN(num)){
    return '0.00'
  }

  let arrayNum = num.toString().split(".");
  if (arrayNum. length == 1) {
    return num.toString() + ".00";
  }

  if (arrayNum .length > 1) {
    if (arrayNum[1].length < 2) { // 小数点右侧 如果小于两位则补一个0
      return num.toString() + "0";
    }
    return num;
  }
}

vue template

<el-input v-model="cost" placeholder="请输入金额(元)" @blur="handleInputCheck"></el-input>

vue javascript

methods: {
    handleInputCheck(e){
     	e.target.value = toDecimal(e.target.value);
     	this.cost = e.target.value;
    }
}

猜你喜欢

发表评论

最新发布