需求:input標簽聚焦事件后默認彈起軟鍵盤,PDA屏幕過小的情況下不需要彈起軟鍵盤(軟鍵盤彈起蓋過80%的屏幕)
問題點:使用鍵盤監聽事件,監聽輸入的內容,每次監聽只能返回一次一個字符串
插件市場下載鏈接:keyboard-listener - DCloud 插件市場uni-app 全局按鍵事件監聽https://ext.dcloud.net.cn/plugin?id=2548?
實現原理:用插件監聽鍵盤事件:過濾數字鍵和刪除按鍵(只能輸入數字和刪除鍵)
把識別的數字加入數組中,按刪除鍵則調用數組pop()方法刪除最后一個,最后用join()
將數組轉換字符串
代碼:?
?? ??? ??? ?emitKeyDown(e) {
?? ??? ??? ??? ?const arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']
?? ??? ??? ??? ?const checkNum = arr.includes(e.key)
?? ??? ??? ??? ?///彈出打印數量框,并且選了點了結尾數的情況要取消當前鍵盤輸入
?? ??? ??? ??? ?if (!this.isfoucsWeight) {
?? ??? ??? ??? ??? ?if (checkNum) {
?? ??? ??? ??? ??? ??? ?this.keydownNumPrint = [...this.keydownNumPrint, e.key]
?? ??? ??? ??? ??? ?} else if (e.key == 'Backspace' && this.keydownNumPrint.length > 0) {
?? ??? ??? ??? ??? ??? ?this.keydownNumPrint.pop()
?? ??? ??? ??? ??? ??? ?if (this.keydownNumPrint.length ?? ??? ??? ??? ??? ?} else if (e.key == 'Backspace' && this.keydownNumPrint.length ?? ??? ??? ??? ??? ??? ?return this.$uniApi.showInfoMsg(`歸零`);
?? ??? ??? ??? ??? ?} else if (!checkNum) {
?? ??? ??? ??? ??? ??? ?return this.$uniApi.showInfoMsg(`當前打印框不能輸入${e.key},只能識別數字和刪除鍵`);
?? ??? ??? ??? ??? ?}
?? ??? ??? ??? ??? ??? ?this.numberValue = this.keydownNumPrint.join("")
?? ??? ??? ??? ?}
?? ??? ??? ?},
------------------
this.$uniApi.showInfoMsg()是自定義封裝uni.showToast
this.keydownNumPrint? 是存輸入按鍵值的數組?
此方法用于不能用input輸入數字的情況下使用