Element-ui vue 键盘快捷键事件

公司项目有一个这样的需求，是一个后台管理系统，然后点击一个按钮，显示对应的弹窗，有的人会说，那直接给个点击事件不就好了嘛
话虽如此，奈何我们的技术总监的想法有些秀，虽然不懂，操作者会不会记住这么多的快捷键，但是秀还是要滴。

话不多说，直接上代码了哦~

接下来，我先说一下input 绑定键盘事件。

<input type="text"  @keyup.enter="SearchText" v-model="text" placeholder="请输入搜索信息"/>

@keyup.enter=“SearchText” 输入文本后点击【回车】执行的方法。

没错，直接在input上这么写就好啦。

如果不够用的话
那么上代码

document.onkeydown = function(e) {
   //e.keyCode 输出的值就是键值啦
   console.log(e.keyCode);
}

当然啦，vue也对键值也做了一些别名，简单便捷并且不用配置键值了

当然啦，还有我们的组合写法

呐，用法也是非常简单

<input type="text"  @keyup.enter="SearchText" v-model="text" placeholder="请输入搜索信息"/>
<input type="text"  @keydown.enter="SearchText" v-model="text" placeholder="请输入搜索信息"/>
<input type="text"  @keyup.67="SearchText" v-model="text" placeholder="请输入搜索信息"/>

那会有小伙伴遇到那种，不是input的按键操作
当然也有啦

created: function() {
       document.addEventListener('keydown',this.handleEvent)
},
methods: {
	handleEvent(e){
       var that = this;
        //alt+F  
        let key = window.event.keyCode;  
        if (70 == e.keyCode && e.altKey){
            //如果是Alt+F 的操作的话，方法执行与此
        }
    },
},
beforeDestroy(){
   document.removeEventListener('keydown', this.handleEvent);
}

补充说明

1.键盘按下事件：keydown() 是在键盘按下就会触发
2.键盘弹起事件：keyup() 是在键盘松手就会触发