Навигация: метод reload()

Метод reload() интерфейса Navigation перезагружает текущий URL, обновляя любой предоставленный статус в списке записей истории.

options Необязательный

Объект опций, содержащий следующие свойства:

state Необязательный

Определяемая разработчиком информация, которая будет храниться в связанной записи NavigationHistoryEntry после завершения навигации, доступная через getState(). Это может быть любой тип данных. Например, вы можете сохранить количество посещений страницы для аналитики или сохранить детали состояния пользовательского интерфейса, чтобы представление отображалось точно так, как пользователь его оставил. Любые данные, хранящиеся в state , должны быть структурированно клонируемыми.

info Необязательный

Определяемая разработчиком информация, передаваемая событию navigate, доступная в NavigateEvent.info. Это может быть любой тип данных. Например, вы можете отобразить недавно навигационное содержимое с другой анимацией в зависимости от того, как оно было загружено (влево, вправо или на главную). Строка, указывающая, какую анимацию использовать, может быть передана как info.

Объект со следующими свойствами:

committed

Обещание Promise, которое выполнится, когда видимый URL изменится и будет создана новая запись NavigationHistoryEntry.

finished

Обещание Promise, которое выполнится, когда все обещания, возвращённые обработчиком intercept(), будут выполнены. Это эквивалентно выполнению обещания NavigationTransition.finished, когда срабатывает событие navigatesuccess.

Любое из этих обещаний отклоняется, если навигация по какой-либо причине не удалась.

DataCloneError DOMException

Выбрасывается, если параметр state содержал значения, которые не являются структурированно клонируемыми.

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

  // Update application state
  // ...
}

Перезагрузка страницы и добавление новой записи состояния:

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

  // Update application state
  // ...
}

• Современное клиентское маршрутизирование: API навигации
• Объяснение API навигации
• Демонстрация API навигации Domenic Denicola