vue绑定快捷键
比如我们要在某个页面绑定一个ctrl+s的快捷键因为防止按下快捷键触发多次的情况,所以需要将keydown和keyup都绑定1.在js全局设定一个变量var flag = true2.在methods里面写入两个新函数handleKeyDown(e) {var key = window.event.keyCode ? window.event.keyCode : window...
·
比如我们要在某个页面绑定一个ctrl+s的快捷键
因为防止按下快捷键触发多次的情况,所以需要将keydown和keyup都绑定
1.在js全局设定一个变量
var flag = true
2.在methods里面写入两个新函数
handleKeyDown(e) {
var key = window.event.keyCode ? window.event.keyCode : window.event.which
if( key === 13 ){
if(flag)
{
this.submitForm()
flag = false
}
e.preventDefault() //取消浏览器原有的ctrl+s操作
}
},
handleKeyUp(e) {
// enter
var key = window.event.keyCode ? window.event.keyCode : window.event.which
if( key === 13 ){
flag = true
e.preventDefault()
}
}
3.在created周期中绑定EventListener
created() {
document.addEventListener('keydown', this.handleKeyDown)
document.addEventListener('keyup', this.handleKeyUp)
}
4.一定要记得在离开页面时销毁EventListener,否则快捷键会一直绑定
destroyed() {
document.removeEventListener('keydown', this.handleKeyDown)
document.removeEventListener('keyup', this.handleKeyUp)
},
更多推荐
已为社区贡献2条内容
所有评论(0)