刷新页面时 Aurelia 弹出窗口不起作用

Question

我们知道，当我们点击浏览器上的刷新按钮时，我们可以弹出一个窗口询问我们是否确定要刷新页面。通常是通过在 onbeforeunload 上添加一个事件监听器来完成。

但是，在我的 Aurelia 应用程序中，我尝试这样做，但它不起作用。

假设这是我的 app.js（根 ModelView）

export class App {

this.refreshClicked = () =>{ return "Are you sure you want to exit?"; };

attached(){
window.addEventListener("onbeforeunload", this.refreshClicked);
}

但是它不起作用，但是，如果我们将 return 语句替换为 console.log("clicked")，我可以看到侦听器可以正常工作。

有什么帮助吗？

Answer 1

首先，如果您通过 window.addEventListener 添加事件处理程序，那么在这种情况下您不会使用 on 前缀。所以它是：

attached() {
    window.addEventListener('beforeunload', this.refreshClicked);
}

或更早的、不推荐的语法：

attached() {
    window.onbeforeunload(this.refreshClicked);
}

其次，您需要在 Event 对象和 return 上设置 returnValue 属性相同的字符串值以支持更多浏览器。要了解有关此事件（以及各种浏览器怪癖）的更多信息，请查看 its MDN page。

您的 refreshClicked 应如下所示：

this.refreshClicked = e => {
    const confirmation = 'Are you sure you want to exit?';
    e.returnValue = confirmation;
    return confirmation;
};

刷新页面时 Aurelia 弹出窗口不起作用

Aurelia popup when refreshing the page not working

onbeforeunload

aurelia