序言

在開發專案的過程中，表單需要設定某些欄位輸入的值必須是數字，且是必輸欄位，我使用了element提供的方法v-model.number，但是出現了一點問題。具體見圖：

用了v-model.nuber以後：

看到了圖以後很顯然意見，他雖然完成了必輸欄位需要時數字這個需求，但是他還是可以輸入文字。於是採用了另一種辦法：

具體用法看程式碼：

<el-input v-model="scope.fmdt.thirdYearAssign" class="innerbox" type="number" onkeypress="return( /[\d]/.test(String.fromCharCode(event.keyCode) ) )"></el-input>
 

這裡的  onkeypress="return( /[\d]/.test(String.fromCharCode(event.keyCode) ) )"  是為了解決輸入框不可以輸入e，從而只能輸入數字：

此外需要一點css，來讓輸入框更加完美：

/*------------------------修改type=number的樣式------------------------------------------------*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
input[type="number"]{
    -moz-appearance: textfield;
}
 

這樣就解決了上面的問題，輸入框只能那個輸入數字。