You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
45 lines
1.1 KiB
45 lines
1.1 KiB
// #ifdef H5 |
|
export default { |
|
name: 'Keypress', |
|
props: { |
|
disable: { |
|
type: Boolean, |
|
default: false |
|
} |
|
}, |
|
mounted () { |
|
const keyNames = { |
|
esc: ['Esc', 'Escape'], |
|
tab: 'Tab', |
|
enter: 'Enter', |
|
space: [' ', 'Spacebar'], |
|
up: ['Up', 'ArrowUp'], |
|
left: ['Left', 'ArrowLeft'], |
|
right: ['Right', 'ArrowRight'], |
|
down: ['Down', 'ArrowDown'], |
|
delete: ['Backspace', 'Delete', 'Del'] |
|
} |
|
const listener = ($event) => { |
|
if (this.disable) { |
|
return |
|
} |
|
const keyName = Object.keys(keyNames).find(key => { |
|
const keyName = $event.key |
|
const value = keyNames[key] |
|
return value === keyName || (Array.isArray(value) && value.includes(keyName)) |
|
}) |
|
if (keyName) { |
|
// 避免和其他按键事件冲突 |
|
setTimeout(() => { |
|
this.$emit(keyName, {}) |
|
}, 0) |
|
} |
|
} |
|
document.addEventListener('keyup', listener) |
|
// this.$once('hook:beforeDestroy', () => { |
|
// document.removeEventListener('keyup', listener) |
|
// }) |
|
}, |
|
render: () => {} |
|
} |
|
// #endif
|
|
|