VUE中的键盘事件（按键别名）

1.vue中常用的按键别名：

1. 回车 => enter
2. 删除 => delete(捕获“删除”和“退格”键)
3. 退出 => esc
4. 空格 => space
5. 换行 => tab   //不适合用keyup事件，tab会切走当前选中的元素 用keydown比较好
6. 上 => up
7. 下 => down
8. 左 => left
9. 右 => right

   <input type="text" placeholder = "按下回车提示输入" @keyup.enter="showInfo"></input>//keyup是键盘按键抬起时触发的事件
   
   function showInfo(event){
     alert("输入了",event.target.value)       
   }

2.vue中未提供别名的按键可以使用按键原始的key值去绑定，但要注意要转换为caps-lock（切换大小写键，多单词按键需要全转换为小写并用“-”连接）

<input type="text" placeholder = "按下回车提示输入" @keyup.caps-lock="showInfo"></input>

3.系统修饰键(用法特殊)：ctrl,alt,shift,meta(菜单键)

（1）配合keyup使用：按下修饰键的同时，再按下其他键，随后释放其他键，事件才会触发

<input type="text" placeholder = "按下回车提示输入" @keyup.ctrl="showInfo"></input>//ctrl+y  并且松开y键时 才会触发事件

（2）配合keydown使用：正常触发事件

4. 也可以通过keyCode去指定具体的按键（不推荐）

<input type="text" placeholder = "按下回车提示输入" @keyup.13="showInfo"></input>//13为回车键

5.Vue.config.keyCodes.自定义键名 = 键码 ，可以定制按键（也不太推荐）

Vue.config.keyCodes.huiche = 13 //定义了一个按键别名