作者:艺静不循环_545_191 | 来源:互联网 | 2023-02-10 01:05
需求: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 <1) return this.numberValue = 0
} else if (e.key == &#39;Backspace&#39; && this.keydownNumPrint.length <1) {
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输入数字的情况下使用