Navigation: reload() 方法

语法

reload()
reload(options)

参数

options 可选

一个包含以下属性的选项对象

state 可选

在导航完成后要存储在关联的 NavigationHistoryEntry 中的开发者定义的信息，可以通过 getState() 检索。这可以是任何数据类型。例如，您可能希望存储页面访问次数以用于分析，或者存储 UI 状态详细信息，以便可以显示用户上次离开时的视图。存储在 state 中的任何数据都必须是 结构化克隆 的。

info 可选

要传递给 navigate 事件的开发者定义的信息，可在 NavigateEvent.info 中访问。这可以是任何数据类型。例如，您可能希望根据内容的导航方式（左滑、右滑或主页）以不同的动画显示新导航的内容。可以将指示使用哪种动画的字符串作为 info 传递。

返回值

具有以下属性的对象：

committed

一个 Promise，当可见 URL 已更改且已创建新的 NavigationHistoryEntry 时，它将fulfilled。

finished

一个 Promise，当 intercept() 处理程序返回的所有 Promise 都 fulfilled 时，它将 fulfilled。这相当于 NavigationTransition.finished Promise fulfilled，当 navigatesuccess 事件触发时。

如果导航因某种原因失败，则这两个 Promise 中的任何一个都会 rejected。

异常

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 解释器