NavigateEvent: navigationType 属性
NavigateEvent 接口的只读属性 navigationType 返回导航的类型——push、reload、replace 或 traverse。
值
表示导航类型的枚举值。
可能的值为
push: 导航到一个新位置，导致将新条目推送到历史记录列表。reload: 重新加载Navigation.currentEntry。replace: 将Navigation.currentEntry替换为新的历史记录条目。此新条目将重用相同的key，但会被分配一个不同的id。traverse: 浏览器从一个现有历史记录条目导航到另一个现有历史记录条目。
示例
具有特殊后退/前进处理的异步过渡
有时希望特别处理后退/前进导航，例如，通过将缓存的视图过渡到屏幕来重用它们。这可以通过以下方式实现分支：
js
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 |
浏览器兼容性
加载中…