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 |
瀏覽器相容性
載入中…