input输入框限制只能输入两位小数（电价只能输入到分）

首先讲一下功能需求，input框输入限制最多输入到小数点后两位，小数点前必须是符合数字规范不能出现非法字符之类的情况

刚开始写的时候单纯想用正则去实现后来发现好像会有很多问题，和我的好基友探讨之后发现最后只能通过自己写个方法监听用户输入去实现，话不多说直接上代码！

通过@input用来监听用户输入值，只要输入值变化就会触发filterNumberAndDot()方法

通过data里return的group.electricPrice绑定输入框的值

data(){
    return {
      group:{
        electricPrice:''
     }
   }
}

接下来最重要的filterNumberAndDot()方法

具体需要解释的地方在代码中已经标出

filterNumberAndDot() {
      let value = this.group.electricPrice;
      value = value
        .replace(/[^\d.]/g, "") //将非数字和点以外的字符替换成空
        .replace(/^\./g, "") //验证第一个字符是数字而不是点
        .replace(/\.{2,}/g, ".") //出现多个点时只保留第一个
        .replace(".", "$#$") // 1、将数字的点替换成复杂字符$#$
        .replace(/\./g, "") // 2、将字符串的点直接清掉
        .replace("$#$", ".") // 3、将复杂字符再转换回点
        .replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); //只能输入两个小数
      if (value.indexOf(".") < 0 && value != "") {
          value = parseFloat(value);
      } else if (value.indexOf(".") > 1 && value[0] === '0') {
          value = parseFloat(value);
      }
      // this.$set向响应式对象中添加一个属性，并确保这个新属性同样是响应式的，且触发视图更新

      //调用方法：this.$set( target, key, value )
      // target：要更改的数据源(可以是对象或者数组)
      // key：要更改的具体数据
      // value ：重新赋的值
      this.$set(this.group,'electricPrice',value.toString())
    }

最后大功告成，我们需要实现的功能就完成了