VueJS listening to keycombinations via mounted event listener
VueJS listening to keycombinations via mounted event listener
I have working global key listener, but it manages to catch only single key stroke. How can I catch combinations like ctrl+enter?
mounted()
window.addEventListener
(
"keypress", e =>
console.log(e.key);
);
,
Input device events
Input device events
click, contextmenu, DOMMouseScroll, dblclick, gamepadconnected, gamepaddisconnected, keydown, keypress, keyup, MozGamepadButtonDown, MozGamepadButtonUp, mousedown, mouseenter, mouseleave, mousemove, mouseout, mouseover, mouseup, mousewheel, MozMousePixelScroll, pointerlockchange, pointerlockerror,wheel
click, contextmenu, DOMMouseScroll, dblclick, gamepadconnected, gamepaddisconnected, keydown, keypress, keyup, MozGamepadButtonDown, MozGamepadButtonUp, mousedown, mouseenter, mouseleave, mousemove, mouseout, mouseover, mouseup, mousewheel, MozMousePixelScroll, pointerlockchange, pointerlockerror,wheel
none of those seems to fit it
nor this is not working properly
"keypress", e =>
if (e.ctrlKey)
console.log(e.key);
1 Answer
1
Try this, we're checking ctrl is pressed and the (another) pressed key is not ctrl:
window.addEventListener
(
"keydown", e =>
var evt = window.event ? event : e;
if (evt.ctrlKey && evt.keyCode !== 17)
console.log('Ctrl + ' + e.key);
);
JSFiddle
You may also be interested in using vue-global-events which allows you to write global key listeners in Vue style (e.g. @keyup.ctrl.tab="nextTab").
@keyup.ctrl.tab="nextTab"
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
