Navigation: reload() 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 reload() Methode des Navigation-Interfaces lädt die aktuelle URL neu und aktualisiert dabei den bereitgestellten Zustand in der Liste der Historie-Einträge.

Syntax

js
reload(options)

Parameter

options Optional

Ein Optionsobjekt, das die folgenden Eigenschaften enthält:

state Optional

Vom Entwickler definierte Informationen, die in dem zugeordneten NavigationHistoryEntry gespeichert werden sollen, sobald die Navigation abgeschlossen ist, und die über getState() abgerufen werden können. Dies kann jeder Datentyp sein. Sie könnten beispielsweise die Anzahl der Seitenbesuche für Analysezwecke speichern oder Details zum UI-Zustand, damit die Ansicht genau so angezeigt werden kann, wie der Benutzer sie zuletzt verlassen hat. Alle im state gespeicherten Daten müssen strukturklonbar sein.

info Optional

Vom Entwickler definierte Informationen, die an das navigate-Ereignis übergeben werden, verfügbar in NavigateEvent.info. Dies kann jeder Datentyp sein. Beispielsweise könnten Sie den neu navigierten Inhalt mit einer anderen Animation anzeigen, abhängig davon, wie er navigiert wurde (nach links wischen, nach rechts wischen oder zum Startbildschirm gehen). Ein String, der angibt, welche Animation zu verwenden ist, 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 neuer NavigationHistoryEntry erstellt wurde.

finished

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

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

Ausnahmen

DataCloneError DOMException

Wird ausgelöst, wenn der state-Parameter Werte enthielt, die nicht strukturklonbar sind.

Beispiele

Verwendung von info und state

js
async function handleReload() {
  await navigation.reload({
    info: { animation: "fade-in" },
    state: { infoPaneOpen: true },
  }).finished;

  // Update application state
  // ...
}

Seite neu laden und ein neues Zustandsobjekt hinzufügen:

js
async function handleReload() {
  await navigation.reload({
    state: { ...navigation.currentEntry.getState(), newState: 3 },
  }).finished;

  // Update application state
  // ...
}

Spezifikationen

Specification
HTML
# dom-navigation-reload-dev

Browser-Kompatibilität

Error loading BCD data

Siehe auch