[Vuejs]-Bootstrap vue input type="number"

by

0👍

✅

You can achieve it by cancel the keyboard event for invalid input using keydown event.

Demo :

new Vue({
  el: "#app",
  data: {
    port: "",
  },
  methods: {
    portKeydown(e) {
      if (/^\+$/.test(e.key)) {
        e.preventDefault();
      }
    },
  },
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div class="demo">
    <div>
      <div>With key handler:</div>
      <input type="number" v-model="port" @keydown="portKeydown($event)" />
    </div>
  </div>
</div>

Leave a comment