Navigation:back() 方法

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

Navigation 接口的 back() 方法在导航历史记录中向后导航一个条目。

语法

js
back(options)

参数

options 可选

包含以下属性的选项对象:

info 可选

开发人员定义的信息,将传递给 navigate 事件,可在 NavigateEvent.info 中获取。这可以是任何数据类型。例如,你可能希望根据导航方式(向左滑动、向右滑动或返回主页)以不同的动画显示新导航的内容。可以传入一个字符串来指示要使用哪种动画,该字符串可作为 info 传入。

返回值

具有以下属性的对象:

committed

当可见 URL 发生改变并且新的 NavigationHistoryEntry 被创建时,将兑现的 Promise

finished

intercept() 处理器返回的所有 promise 都被兑现时,将兑现的 Promise。这相当于当 navigatesuccess 事件触发时,兑现 NavigationTransition.finished promise。

如果导航由于某种原因失败,则这两个 promise 中的任意一个会被拒绝。

异常

InvalidStateError DOMException

如果 Navigation.currentEntryNavigationHistoryEntry.index 值为 -1 或 0,即当前 Document 尚未激活,或者当前历史记录条目是历史记录中的第一个,这意味着无法向后导航,或者当前 Document 正在卸载时,抛出此异常。

示例

js
async function backHandler() {
  if (navigation.canGoBack) {
    await navigation.back().finished;
    // 导航结束后处理任何必要的清理工作
  } else {
    displayBanner("你在第一页");
  }
}

async function forwardHandler() {
  if (navigation.canGoForward) {
    await navigation.forward().finished;
    // 导航结束后处理任何必要的清理工作
  } else {
    displayBanner("你在最后一页");
  }
}

规范

Specification
HTML
# dom-navigation-back-dev

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
back
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.

参见