如何关闭浏览器选项卡中的react应用程序时显示警报

Question

我已经尝试了下面的代码来显示警报，而我们正在从浏览器选项卡中关闭React应用程序，但是没有发生，它正在关闭而没有警报。我也尝试了其他有用的帖子，但对我没有任何帮助。

任何帮助都会有所帮助和赞赏。

    import React from "react";
    import ReactDOM from "react-dom";

    class App extends React.Component {
      onUnload = e => {
        e.preventDefault();
        alert("hi");
      };

      componentDidMount() {
        window.addEventListener("beforeunload", this.onUnload);
      }

      render() {
        return "Alok"
      }
    }

    const rootElement = document.getElementById("root");
    ReactDOM.render(<App />, rootElement);

Answer 1

尝试创建gloabal函数handleGloablListeners并处理beforeunload事件内部；例如：

import React from "react";
import ReactDOM from "react-dom";

function handleGloablListeners() {
  window.addEventListener("beforeunload", () => {
    alert('Alok');
  });
}

class App extends React.Component {
  componentDidMount() {
    handleGloablListeners();
  }

  render() {
    return "Alok"
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);