vue的按键修饰符不够用了,只能在输入状态下使用
这时可以通过 js 的 document.onkeydown 来监听用户敲击键盘事件执行方法
- onkeydown — 按下按键事件立即执行
- onkeyup — 按键抬起后执行
执行时机的区别,一旦按下并不能取消执行
created() {
document.onkeydown = () => {
const e = event.keyCode
if (e == 13)
//Enter
this.startTest();
if (e == 32)
//Space
this.onDirection();
if (e == 68)
//D
this.onDrop();
if (e == 70)
//F
this.onFull();
};
},
当一个项目内多个组件都需要监听按键,使用onkeydown就会冲突出bug 这时就需要改用addEventListener方法
document.addEventListener("keydown", () => {
let e = event.keyCode;
....
keycode对照表: