Vue: @keydown.tab erfasst auch Shift + Tab

Ja, es wird erwartet. Sie sollten explizit überprüfen, dass die Umschalttaste nicht gedrückt ist

Hier ist das Lösungs-Markup, um dies zu erreichen:

<your-element @keydown.tab="handleTabPress(someData, $event)"></your-element>

Innerhalb der Handler-Funktion können Sie feststellen, ob SHIFT gehalten wird, indem Sie $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);
},

Nur um dies zu aktualisieren, da vue 2.5.0 den .exact-Modifikator hat, der genau dieses Verhalten verhindert:

@keydown.tab.exact="dostuff()"

Dies funktioniert nur, wenn die Tabulatortaste gedrückt wird, nicht wenn Umschalt + Tabulatortaste gedrückt wird. Weitere Informationen finden Sie unter https://vuejs.org/v2/guide/events.html#exact -Modifier.