vue+element如何限制input输入框只能输入纯数字

vue+element如何限制input输入框只能输入纯数字

1,首先在main.js中定义这段代码

Vue.directive('enterNumber', {
  inserted: function (el) {
    el.addEventListener("keypress",function(e){
      e = e || window.event;
      let charcode = typeof e.charCode === 'number' ? e.charCode : e.keyCode;
      let re = /\d/;
      if(!re.test(String.fromCharCode(charcode)) && charcode > 9 && !e.ctrlKey){
        if(e.preventDefault){
          e.preventDefault();
        }else{
          e.returnValue = false;
        }
      }
    });
  }
});

2,然后就可以直接在组件中调用。

<el-input v-enter-number type="number" v-model="number" ></el-input>

你可能感兴趣的:(vue)