Vue.js @keydown 获取被按下的键答案

【问题标题】：Vue.js @keydown get key that was pressedVue.js @keydown 获取被按下的键
【发布时间】：2021-06-12 19:18:51
【问题描述】：

我想用 Vue.js 输出按下了哪个键。

此代码有效：

window.addEventListener('keydown', (event) => { 
   console.log(event.key);
});

类似的东西例如：

<div @keydown="getKey">
</div>

getKey: function(event) {
   console.log(event.key)
}

【问题讨论】：

这确实有效，但在输入框和文本区域中……它似乎在 div 中不起作用。为什么你不能使用第一个例子呢？

标签： javascript vue.js events keyboard keydown

【解决方案1】：

要实现这一点，您需要将事件监听器分配给 vue 方法：


created() {
  window.addEventListener('keydown', this.handleKeyDown);
},
beforeDestroy() {
  window.removeEventListener('keydown', this.handleKeyDown);
},
methods: {
  handleKeyDown(event) {
    console.log(event);
  }
}

【讨论】：