Javascript 当用户试图退出时用回调提示

我有一个页面，其中有一个用户之间的Webrtc调用

我希望当用户尝试转到另一个页面/重新加载页面/退出浏览器时，会有一个提示，询问他是否确定要离开该页面，如果用户按“是”，我希望有一个回调

在回调（不确定是否相关）中，我将关闭对等方并正确断开所有连接，这样通话将断开，用户将不再听到音频，另一方将知道用户也断开了连接

• 要在刷新时执行此操作，我看到了

  窗口.onunloaded

  函数

• 甚至在浏览器退出时也可以吗

• 我看到了

  提示符

  选项在路线更改时执行此操作，但我没有看到如何在确认时插入回调

我会很高兴得到一个工作的例子，因为它觉得这样一个小事情是奇怪的复杂

---

谢谢。

处理React的导航事件

我想你要找的是

BrowserRouter

组件的

getUserConfirmation

道具

传递给道具的函数可能如下所示（TypeScript示例）：

在定义路线的位置：

<BrowserRouter getUserConfirmation={getUserConfirmation}>
    ... routes go here ...
</BrowserRouter>

不再需要它后，可以进行清理：

window.onbeforeunload = null;

综上所述，在

onbeforeunload

中，似乎不可能立即捕获用户对本机确认窗口的响应

---

可能是

窗口。onunload

将是清理您的内容的正确位置，因为这很可能意味着用户选择离开页面。

如何在默认模式下使用此选项？因为它现在不使用默认值（它不显示），所以我最初添加了一个案例，它涵盖React的导航事件，而不涵盖浏览器的卸载事件。我做了一个编辑，显示了如何订阅卸载事件，以及根据您的逻辑显示或不显示浏览器对话框。是的，谢谢您。但我的意思是，每当我将

getUserConfirmation

添加到

BrowserRouter

属性时，我都不会得到提示，也许它会覆盖默认的提示？我想要默认的一个，但是要像您的示例中那样进行清理的选项，所以您想在React导航和浏览器刷新时打开浏览器的本机提示吗？是的，我不介意如何进行提示，重要的是后面的回调：）

<Prompt
     when={boolean}
     message="This string will be supplied in the confirmation function above as second parameter"
/>

window.onbeforeunload = () => {
    // some non-blocking logic

    return true;
};

window.onbeforeunload = null;