Vue中监听键盘事件

Posted 2023-03-04

参考技术A keyCode 实际键值
48到57 0到9
65到90 a到z（A到Z）
112到135 F1到F24
8 BackSpace（退格）
9 Tab
13 Enter（回车）
20 Caps_Lock（大写锁定）
32 Space（空格键）
37 Left（左箭头）
38 Up（上箭头）
39 Right（右箭头）
40 Down（下箭头）

Vue中：

别名 实际键值
.delete delete（删除）/BackSpace（退格）
.tab Tab
.enter Enter（回车）
.esc Esc（退出）
.space Space（空格键）
.left Left（左箭头）
.up Up（上箭头）
.right Right（右箭头）
.down Down（下箭头）
.ctrl Ctrl
.alt Alt
.shift Shift
.meta (window系统下是window键，mac下是command键)

另外，Vue中还支持组合写法：
组合写法 按键组合：
@keyup.alt.67=”function” Alt + C
@click.ctrl=”function” Ctrl + Click

参考： https://blog.csdn.net/xiaxiangyun/article/details/80404768

vue监听移动端软件键盘搜索（enter）事件

参考技术A vue中监听手机键盘的【完成】或【搜索】按钮触发事件，需要两个条件
1.form表单，输入框
2.@keyup.13 事件 或者 直接@keyup 然后事件的处理函数里判断 event.keyCode === 13