全局的键盘监听事件

一、设定全局键盘监听事件 

放在vue 的created()或者mounted ()中，可对整个文档进行键盘事件监听。

new Vue({  
  created() {  
    window.addEventListener('keydown', this.handleKeydown);  
  },  
  beforeDestroy() {  
    window.removeEventListener('keydown', this.handleKeydown);  
  },  
  methods: {  
    handleKeydown(e) {  
      console.log('keydown event triggered', e);  
    }  
  }  
}).$mount('#app');

 或者

 // 监听键盘事件
    document.addEventListener('keydown', function (event) {
      console.log('按下的键: ', event.key)
 
      // 根据不同的键执行不同的操作
      switch (event.key) {
        case 'Delete':
          self.delEl()
          // 执行 a 键对应的操作
          break
        case 'Backspace':
          self.delEl()
          // 执行 b 键对应的操作
          break
        // 其他键...
        default:
          break
      }
    })

二、特定的div中禁用全局的键盘事件

关键：@keydown.stop