NavigateEvent: navigationType-Eigenschaft
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die schreibgeschützte navigationType-Eigenschaft des NavigateEvent-Interfaces gibt den Typ der Navigation zurück — push, reload, replace oder traverse.
Wert
Ein enumerierter Wert, der den Typ der Navigation darstellt.
Die möglichen Werte sind:
push-
Ein neuer Standort wird angesteuert, wodurch ein neuer Eintrag in die Verlaufsliste eingefügt wird.
reload-
Der
Navigation.currentEntrywird neu geladen. replace-
Der
Navigation.currentEntrywird durch einen neuen Historieneintrag ersetzt. Dieser neue Eintrag wird denselbenkeywiederverwenden, aber eine andereidzugewiesen bekommen. traverse-
Der Browser navigiert von einem bestehenden Historieneintrag zu einem anderen bestehenden Historieneintrag.
Beispiele
Asynchrone Übergänge mit spezieller Behandlung von Zurück-/Vorwärtsnavigation
Manchmal ist es wünschenswert, Zurück-/Vorwärtsnavigationen speziell zu behandeln, z. B. durch Wiederverwendung von zwischengespeicherten Ansichten, indem sie auf den Bildschirm verschoben werden. Dies kann durch Verzweigung wie folgt erreicht werden:
navigation.addEventListener("navigate", (event) => {
// Some navigations, e.g. cross-origin navigations, we
// cannot intercept. Let the browser handle those normally.
if (!event.canIntercept) {
return;
}
// Don't intercept fragment navigations or downloads.
if (event.hashChange || event.downloadRequest !== null) {
return;
}
event.intercept({
async handler() {
if (myFramework.currentPage) {
await myFramework.currentPage.transitionOut();
}
let { key } = event.destination;
if (
event.navigationType === "traverse" &&
myFramework.previousPages.has(key)
) {
await myFramework.previousPages.get(key).transitionIn();
} else {
// This will probably result in myFramework storing
// the rendered page in myFramework.previousPages.
await myFramework.renderPage(event.destination);
}
},
});
});
Spezifikationen
| Specification |
|---|
| HTML # dom-navigateevent-navigationtype-dev |