指定按键事件
vue
<input @keyup.caps-lock="demo"></input>Vue中常用的按键别名
- 回车:enter
- 删除:delete
- 退出:esc
- 空格:space
- 换行:tab(必须配合keydown使用)
- 上:up
- 下:down
- 左:left
- 右:right
Vue中未提供别名的按键
可以通过原始按键的编码去绑定,但要注意多个单词链接的按键名需要将各个单词的首字母小写且单词之间用- 连接 如@keyup.caps-lock
特殊的几个按键
- tab
- shift
- ctrl
- alt
- win(meta)
使用keyup事件无法直接触发,必须配合keydown事件
如需使用keyup,需要配合其他按键一起使用。按下其他的按键然后松开即可触发
小技巧:指定按键组合
JavaScript
<input @keyup.ctrl.y="demo"></input>绑定按键编码(不推荐)
vue
<input @keyup="demo"></input>
demo(event){
if(event.keyCode == 13){
console.log("dadaw");
}
}自定义Vue别名按键
vue
// 定义别名按键
Vue.config.keyCodes.huiche = 13;