拒絕vue輸入中的非數字

Question

有人知道如何實現一個在用戶嘗試輸入時拒絕輸入非數字的 VUE 輸入字段。

一些：

<b-form-input v-on:keypress="onlyNumber(...."

謝謝！

Answer 1

最簡單的方法是將輸入類型聲明為數字。 <b-form-input type="number"...

Answer 2

最后，對我來說，這可以完成工作：

    <input v-on:keydown="onlyNumber($event)" ... />

    

onlyNumber: function(evt) { //0035621
        evt = (evt) ? evt : window.event;
        var charCode = (evt.which) ? evt.which : evt.keyCode;
        if (charCode > 31 && (charCode != 46 &&(charCode < 48 || charCode > 57))) {
            evt.preventDefault();
        } else {
            return true;
        }
    }

Answer 3

如果 keyCode 不用於非數字鍵，則可以使用 keydown 事件上按下的鍵的 keyCode 和 perevent 默認行為；

Vue輸入組件：

<b-form-input @keydown="onlyNumbers" />

onlyNumbers 方法是：

onlyNumbers(e) {
    if((e.keyCode < 48 || e.keyCode > 57) && (e.keyCode < 96 || e.keyCode > 105)) {
        e.preventDefault();
}

相關鏈接： 數字小鍵盤的 keyCode 值、 preventDefault 、 Keydown 事件