如何禁用 "Leave site?. Changes you made may not be saved" 在 angular 中弹出？

Question

我试图在到达订单确认页面后关闭浏览器，它会发出如下所示的警告。这会让用户误以为他的更改未保存。所以我想避免这个弹出窗口。

我知道此警报是由于 beforeunload 事件触发的。我尝试过的解决方案：

window.addEventListener("beforeunload",(event)=>{
    return null;
})

和

 window.onbeforeunload=null;

我没有在我的应用程序中使用 jQuery。有没有其他方法可以禁止触发此事件。

我试过的链接：

How to disable/override "Do you want to leave this site?" alert?

How to disable "Changes you made may not be saved." dialog box (Chrome)?

None 他们为我工作。

如果没有 jQuery，我该如何实现？我感到困惑的是如何处理此事件，使其不显示弹出窗口。

我正在使用 Chrome 版本 101.0.4951.64

Answer 1

这可能是由于您的代码中的某些 third-party 库或其他功能侦听“beforeunload”事件并可能修改了 event.returnValue 的值。

此解决方法可能适合您。

window.addEventListener('beforeunload', function (event) {
  event.stopImmediatePropagation();
});

这将阻止链中其他侦听器的执行。

将这段代码包含在应用程序的顶部非常重要，以确保您的功能首先被执行。

如果是Angular，一个好的地方可以放在AppComponent的ngOnInit中

Answer 2

只是添加了一个beforeunload事件的MDN文档以供参考。

当此事件 returns（或将 returnValue 属性设置为）非 null 或 undefined 值时，将提示用户确认页面卸载。

Internet Explorer 不遵守空值 return 并将其作为“空”文本显示给用户。 您必须使用 undefined 来跳过提示。

How to disable "Leave site?. Changes you made may not be saved" pop up in angular?