javascript - ReactJS - 单击 WebBrowser 前进/后退/刷新按钮时的警报消息

Question

我需要在 ReactJS 中实现一个脚本/函数，以防止用户在没有确认警报消息的情况下返回或刷新或继续ReactJS 中的实际应用程序页面。

我的家：localhost:3000/简历页面：localhost:3000/resume

如果用户在/resume页面中，然后意外或故意尝试使用典型的 WebBrowser 控件刷新、返回或继续，ReactJS 中的应用程序会检测到该操作并显示警告消息，例如：“哇！你正在尝试离开页面，如果继续，可能会丢失所有数据。确定要继续吗？

¿关于如何解决它的任何想法？

非常感谢先进。

标签： javascriptnode.jsreactjsecmascript-6

Answer 1

您可以使用纯 JS 来实现这一点。window.onbeforeunload如此处所述，您可以在卸载页面甚至取消事件本身之前执行某些操作。

window.onbeforeunload = (e) => {
// Your alert logic could be invoked here...
};