LOADING...

加载过慢请开启缓存(浏览器默认开启)

loading

Vue中的键盘事件

2022/5/11 vue

keyup:键盘按下后抬起

keydown:键盘按下

  1. Vue中常用的按键别名:

    • 回车 => enter

    • 删除 => delete(捕获“删除”和“退格”键)

    • 退出 => esc

    • 空格 => space

    • 换行 => tab(特殊,必须配合keydown使用)

    • 上 => up

    • 下 => down

    • 左 => left

    • 右 => right

      enter:按下回车后触发

​ 2.Vue未提供别名的按键,可以使用按键原始的key值去绑定,需要注意的是,例如CapsLock这种需要转为caps-lock来使用

​ e.key:键盘按键名

​ e.keyCode:按键编码

​ 3.系统修饰符:ctrl、alt、shift、meta

  • 配合keyup使用:按下修饰键的同时,再按下其他键,然后释放其他键,事件才会被触发

  • 配合keydown使用:正常触发事件

  • 只有按下特定按键才会触发:如@keyup.ctrl.y,只有按下ctrl和y两个按键时才会触发

    4.使用keyCode去指定具体按键,如keyup.13,但是不推荐

    5.定制按键别名:Vue.config.keyCodes.自定义键名=键码,如Vue.config.keyCodes.huiche=13

img_show