vue监听页面快捷键(保存,复制)
1、createdcreated() {document.addEventListener('click', this.handleKeyClick)document.addEventListener('keydown', this.handleKeyDown)document.addEventListener('keyup', this.handleKeyUp)},2、methodshandle
·
1、created
created() {
document.addEventListener('click', this.handleKeyClick)
document.addEventListener('keydown', this.handleKeyDown)
document.addEventListener('keyup', this.handleKeyUp)
},
2、methods
handleKeyClick(e) {
if (e.target.className !== 'right-menu') {
this.showMenu = false
} else {
this.showMenu = true
}
},
handleKeyDown(e) {
console.log(e)
if (this.arrKey.length > 0) { // a-z的按键 长按去重
if (this.arrKey.indexOf(e.key.toLowerCase()) >= 0) {
return
}
}
this.arrKey.push(e.key.toLowerCase())
this.keydown = this.arrKey.join('+')
console.log('>>>>>>>>keydown')
console.log(this.keydown)
if (this.keydown === 'alt+shift+c') {
this.keydown = ''
this.copyPathAction()
e.preventDefault() // 取消浏览器原有的操作
}
if (this.keydown === 'ctrl+s') {
this.keydown = ''
console.log('>>>>保存啦')
e.preventDefault() // 取消浏览器原有的操作
}
},
handleKeyUp(e) {
this.arrKey.splice(this.arrKey.indexOf(e.key.toLowerCase()), 1)
this.keydown = this.arrKey.join('+')
e.preventDefault() // 取消浏览器原有的操作
}
3、销毁!!!
destroyed() {
document.removeEventListener('click', this.handleKeyClick)
document.removeEventListener('keydown', this.handleKeyDown)
document.removeEventListener('keyup', this.handleKeyUp)
},
更多推荐
已为社区贡献14条内容
所有评论(0)