NavigateEvent: свойство navigationType
Ограниченная доступность
Эта функция не является Базовой, так как она не работает во всех широко используемых браузерах.
Экспериментальная функция: Это экспериментальная технология
Перед использованием в продакшене внимательно проверьте таблицу совместимости браузеров.
Чтение-только свойство navigationType интерфейса NavigateEvent возвращает тип навигации — push, reload, replace, или traverse.
Значение
Перечисление, представляющее тип навигации.
Возможные значения:
-
push: Переход к новому адресу, добавляя новую запись в историю. -
reload: Перезагрузка текущейNavigation.currentEntry. -
replace: Замена текущейNavigation.currentEntryновой записью истории. Эта новая запись будет использовать тот жеkey, но будет иметь другойid. -
traverse: Переход браузера от одной существующей записи истории к другой.
Примеры
Асинхронные переходы со специальной обработкой назад/вперёд
Иногда желательно обрабатывать навигацию назад/вперёд специально, например, повторно используя кэшированные представления, переходя на них. Это можно сделать, разветвляясь следующим образом:
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);
}
},
});
});
Спецификации
| Спецификация |
|---|
| HTML # dom-navigateevent-navigationtype-dev |
Совместимость браузеров
| Рабочий стол | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
navigationType |
102 | 102 | Нет | 88 | Нет | 102 | Нет | 70 | Нет | 19.0 | 102 |
См. также
- Современная маршрутизация на стороне клиента: API навигации
- Объяснение API навигации
- Демонстрация API навигации Domenic Denicola
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/NavigateEvent/navigationType