Navigation: traverseTo()-Methode

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die traverseTo()-Methode des Navigation-Interfaces navigiert zu dem NavigationHistoryEntry, das durch den angegebenen key identifiziert wird.

Syntax

js
traverseTo(key)
traverseTo(key, options)

Parameter

key

Der key des NavigationHistoryEntry, zu dem navigiert werden soll.

options Optional

Ein Optionsobjekt, das die folgenden Eigenschaften enthält:

info Optional

Vom Entwickler definierte Informationen, die an das navigate-Ereignis übergeben werden sollen und in NavigateEvent.info verfügbar sind. Dies kann jeder Datentyp sein. Beispielsweise könnten Sie den neu navigierten Inhalt abhängig davon, wie er aufgerufen wurde (nach links wischen, nach rechts wischen oder nach Hause gehen), mit einer anderen Animation anzeigen. Ein String, der angibt, welche Animation verwendet werden soll, könnte als info übergeben werden.

Rückgabewert

Ein Objekt mit den folgenden Eigenschaften:

committed

Ein Promise, das erfüllt wird, wenn sich die sichtbare URL geändert hat und ein neues NavigationHistoryEntry erstellt wurde.

finished

Ein Promise, das erfüllt wird, wenn alle vom intercept()-Handler zurückgegebenen Promises erfüllt sind. Dies entspricht dem Erfüllen des NavigationTransition.finished-Promises, wenn das navigatesuccess-Ereignis ausgelöst wird.

Eines dieser Promises wird abgelehnt, wenn die Navigation aus irgendeinem Grund fehlgeschlagen ist.

Ausnahmen

InvalidStateError DOMException

Wird ausgelöst, wenn der Navigation.currentEntry's NavigationHistoryEntry.index-Wert -1 ist, was bedeutet, dass das aktuelle Document noch nicht aktiv ist, oder wenn die Navigation-Verlaufsliste kein NavigationHistoryEntry mit dem angegebenen Schlüssel enthält, oder wenn das aktuelle Document entladen wird.

Beispiele

Heimtasten-Einrichtung

js
function initHomeBtn() {
  // Get the key of the first loaded entry
  // so the user can always go back to this view.
  const { key } = navigation.currentEntry;
  backToHomeButton.onclick = () => {
    navigation.traverseTo(key);
  };
}
// Intercept navigate events, such as link clicks, and
// replace them with single-page navigations
navigation.addEventListener("navigate", (event) => {
  event.intercept({
    async handler() {
      // Navigate to a different view,
      // but the "home" button will always work.
    },
  });
});

Spezifikationen

Specification
HTML
# dom-navigation-traverseto-dev

Browser-Kompatibilität

Siehe auch