Primitives

useBeforeLeave

编辑此页面

useBeforeLeave 接收一个函数,该函数将在离开路由之前被调用。 这个函数将接收以下参数:

  • from (Location): 当前位置(变更前)。
  • to (string | number): 传递给 navigate 的路径。
  • options (NavigateOptions): 传递给 navigate 的选项。
  • preventDefault (void function): 调用此函数来阻止路由变更。
  • defaultPrevented (readonly boolean): 如果之前调用的任何离开处理器调用了 preventDefault(),则为 true
  • retry (void function, force?: boolean): 调用此函数重试相同的导航。 传入 true 可以跳过再次运行离开处理器(即强制导航而不确认)。

使用示例:

useBeforeLeave((e: BeforeLeaveEventArgs) => {
if (form.isDirty && !e.defaultPrevented) {
// 调用 preventDefault 立即阻止并异步提示用户
e.preventDefault();
setTimeout(() => {
if (window.confirm("放弃未保存的更改 - 您确定吗?")) {
// 用户仍想继续,所以使用 force=true 重试
e.retry(true);
}
}, 100);
}
});
报告此页面问题