Diese Übersetzung wird nicht mehr gepflegt, bitte besuchen Sie das englische Dokument.
Slidev

Konfiguriere Shortcuts

Available since v0.20

Seit v0.35.6 (ausgenommen) entscheide, welche Basiskurzbefehle beibehalten werden sollen (siehe ...base, unten).

Umgebung: client
Diese Konfigurationsfunktion läuft nur auf dem Client. Stelle sicher, dass Browserkompatibilität gegeben ist, wenn Packages importiert werden.

Erste Schritte

Erstelle eine ./setup/shortcuts.ts Datei mit dem folgendem Inhalt:

import type { NavOperations, ShortcutOptions } from '@slidev/types'
import { defineShortcutsSetup } from '@slidev/types'

export default defineShortcutsSetup((nav: NavOperations, base: ShortcutOptions[]) => {
  return [
    ...base, // behalte die bestehenden Shortcuts
    {
      key: 'enter',
      fn: () => nav.next(),
      autoRepeat: true,
    },
    {
      key: 'backspace',
      fn: () => nav.prev(),
      autoRepeat: true,
    },
  ]
})

Mit diesem Setup können eigene Einstellungen für Tastenkürzel aus Navigationen definiert werden. Das obige Beispiel führt die nächste Animation aus, wenn enter gedrückt wird und die letzte Animation, wenn backspace gedrückt wird.

Die Konfigurations-Funktion bekommt ein Objekt mit den Navigationsmethoden und gibt einen Array, welcher die Tastenkürzel und Konfigurationen enthält zurück. Weitere Informationen sind in den Typdefinitionen zu finden.

Erweiterte Shortcuts

Der Typ key erlaubt nur Strings, aber man kann trotzdem an mehrere Tasten, mit Hilfe der folgenden Konvention binden:

import type { NavOperations, ShortcutOptions } from '@slidev/types'
import { defineShortcutsSetup } from '@slidev/types'

export default defineShortcutsSetup((nav: NavOperations, base: ShortcutOptions[]) => {
  return [
    ...base,
    {
      key: 'ShiftLeft+ArrowRight',
      fn: () => nav.next(),
      autoRepeat: true,
    }
  ]
})

Erweiterte Navigationsfunktionen

Die nav-Navigationsoperationen ermöglichen den Zugriff auf einige Funktionen, die über die grundlegenden Funktionen next slide oder previous slide hinausgehen. Siehe die folgenden Anwendungsfälle:

import { defineShortcutsSetup, NavOperations } from '@slidev/types'

export default defineShortcutsSetup((nav: NavOperations) => {
  return [
    {
      key: 'e',
      
      // Die Tastenkombination "e" kann als eine Art Lesezeichen
      // oder Schnellzugriff verwendet werden, 
      // um speziell zur Folie Nummer 42 zu navigieren.
      fn: () => nav.go(42),
      autoRepeat: true,
    }
  ]
})

Siehe useMagicKeys | VueUse für mehr Informationen über das keyPressed Event.