@keydown.tab captures shift + tab too. Is this the expected behavour? If it's a bug, I'll make a repro.
Yes, it's expected. You should explicitly check that shift is not pressed
Here is the solution markup to accomplish this:
<your-element @keydown.tab="handleTabPress(someData, $event)"></your-element>
Inside the handler function, you can detect if SHIFT is held by examining the $event
:
handleTabPress(someData, e) {
// if SHIFT key is held to navigate backwards, exit through this gate
if (e.shiftKey) {
console.log('halting event due to SHIFT+TAB');
return;
}
// otherwise, execute normal logic
console.log('tab was pressed', someData);
},
Just to update this, since 2.5.0 vue has the .exact modifier, that prevents exactly this behaviour:
@keydown.tab.exact="dostuff()"
This will only work when tab is pressed, not when shift + tab ist pressed. See https://vuejs.org/v2/guide/events.html#exact-Modifier for more.
Most helpful comment
Just to update this, since 2.5.0 vue has the .exact modifier, that prevents exactly this behaviour:
@keydown.tab.exact="dostuff()"
This will only work when tab is pressed, not when shift + tab ist pressed. See https://vuejs.org/v2/guide/events.html#exact-Modifier for more.