[Vuejs]-How to force user input number only in <vue-numeric>

1👍

You could try adding a keydown event listener and test the keycode to see if it’s a number:

@keydown="testNumber"

methods: {
  testNumber({ keyCode }) {
    if(keyCode < 48 || keyCode > 57) {
      event.preventDefault()
    }
  }
}

0👍

What you can do is extend/ overwrite the component options – e.g.:

import VueNumeric from "vue-numeric";
const inputHanlder = VueNumeric.methods["onInputHandler"];
VueNumeric.methods["onInputHandler"] = function(val) {
  // here the sanitizer
  this.amount = this.amountNumber;
  inputHanlder.bind(this)();
};
VueNumeric.watch["valueNumber"] = function(newValue) {
  console.log(newValue);
  if (this.$refs.numeric !== document.activeElement) {
    this.amount = this.format(newValue);
  } else {
    this.amount = newValue;
  }
};
export default VueNumeric;

Leave a comment