NavigateEvent: NavigateEvent() Konstruktor

Syntax

new NavigateEvent(type, init)

Parameter

type

Ein String, der den Typ des Ereignisses darstellt.

init

Ein Objekt, das, zusätzlich zu den Eigenschaften, die in Event() definiert sind, die folgenden Eigenschaften hat:

canIntercept Optional

Ein boolescher Wert, der definiert, ob die Navigation abgefangen werden kann oder nicht (z. B. kann eine Cross-Origin-Navigation nicht abgefangen werden). Standard ist false.

destination

Ein NavigationDestination Objekt, das den Zielort der Navigation darstellt.

downloadRequest Optional

Der Dateiname der Datei, die im Falle einer Download-Navigation angefordert wird (z. B. ein <a> oder <area> Element mit einem download-Attribut). Standard ist null.

formData Optional

Das FormData Objekt, das die übermittelten Daten im Falle einer POST-Formularübermittlung darstellt. Standard ist null.

hashChange Optional

Ein boolescher Wert, der definiert, ob die Navigation eine Fragmentnavigation ist (d.h. zu einem Fragment-Identifikator im selben Dokument). Standard ist false.

hasUAVisualTransition Optional

Ein boolescher Wert, der definiert, ob der Benutzeragent eine visuelle Übergangsanimation für diese Navigation durchgeführt hat, bevor dieses Ereignis ausgelöst wurde. Standard ist false.

info Optional

Der info Datenwert, der bei der einleitenden Navigationsoperation übergeben wurde (z. B. Navigation.back(), oder Navigation.navigate()).

navigationType Optional

Der Typ der Navigation. Mögliche Werte — push, reload, replace, und traverse. Standard ist push.

signal

Ein AbortSignal, das abgebrochen wird, wenn die Navigation abgebrochen wird (z. B. indem der Benutzer die "Stop"-Schaltfläche des Browsers drückt, oder eine andere Navigation startet und dadurch die laufende abbricht).

sourceElement Optional

Ein Element Objekt, das das auslösende Element darstellt, wenn die Navigation durch ein Element initiiert wurde, oder null, wenn die Navigation nicht durch ein Element initiiert wurde. Standard ist null.

userInitiated Optional

Ein boolescher Wert, der definiert, ob die Navigation durch den Benutzer initiiert wurde (z. B. durch Klicken auf einen Link, Absenden eines Formulars oder Drücken der "Zurück"/"Vorwärts"-Schaltflächen des Browsers). Standard ist false.

Rückgabewert

Ein neues NavigateEvent Objekt.

Beispiele

Ein Entwickler würde diesen Konstruktor nicht manuell verwenden. Ein neues NavigateEvent-Objekt wird erstellt, wenn ein Handler als Ergebnis des Auslösens des navigate Ereignisses aufgerufen wird.

navigation.addEventListener("navigate", (event) => {
  // Exit early if this navigation shouldn't be intercepted,
  // e.g. if the navigation is cross-origin, or a download request
  if (shouldNotIntercept(event)) {
    return;
  }

  const url = new URL(event.destination.url);

  if (url.pathname.startsWith("/articles/")) {
    event.intercept({
      async handler() {
        // The URL has already changed, so show a placeholder while
        // fetching the new content, such as a spinner or loading page
        renderArticlePagePlaceholder();

        // Fetch the new content and display when ready
        const articleContent = await getArticleContent(url.pathname);
        renderArticlePage(articleContent);
      },
    });
  }
});

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Moderne clientseitige Routing: die Navigation API
• Navigation API Erklärungsdokumentation