Vue限制輸入框只能輸入整數


首先,得明確監聽input輸入框變化的方法是input,不是change

 

方案一:type= "number"

作用:

成功禁止輸入字母

能輸入小數點,第一位可以為0,小數點能輸入多個

eg:01111.5.5

 

方案二:v-model.number

作用:

輸入過程中能輸入字母,但在失去焦點時多余的字母會被清除,且錯誤的字母不會計入值

輸入過程中能輸入小數,例如:12.3

多個錯誤格式的小數會被清除:例如:12.3.5在失去焦點后會變成12.3

第一位可以輸入0,但若之后繼續輸入會被清除,例如:01 失去焦點后會變成1

 

方案三:合二為一

作用:

成功禁止輸入字母

能輸入蹩腳的小數,失去焦點不會清除但不會計入 eg:1.2.3能輸入但計入的是1.2

第一位可以輸入0,但若之后繼續輸入會被清除,例如:01 失去焦點后會變成1

 

可見官網推薦的v-model.number+ type="number"方法對於輸入數字的需求基本滿足,但對或正整數、整數等的需求,還是得我們自己處理


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM