如果您想在离开页面之前显示某种确认信息，请遵循beforeunload event准则
根据规范，要显示确认对话框，事件处理程序应在事件上调用preventDefault（）。
但是请注意，并非所有浏览器都支持此方法，有些浏览器需要事件处理程序实现以下两个旧方法之一：

• 将字符串分配给事件的returnValue属性
• 从事件处理程序返回字符串。

为了防止不需要的弹出窗口，浏览器可能不显示beforeunload事件处理程序中创建的提示，除非页面已经被交互，或者甚至可能根本不显示它们。
HTML规范规定在此事件期间可以忽略对window.alert()、window.confirm()和window.prompt()方法的调用。有关详细信息，请参阅HTML规范。
我刚刚在chrome和safari上测试过，它很好用，我没有windows的盒子，但是这应该可以覆盖大多数情况。

useEffect(() => {
  const unloadCallback = (event) => {
    event.preventDefault();
    event.returnValue = "";
    return "";
  };

  window.addEventListener("beforeunload", unloadCallback);
  return () => window.removeEventListener("beforeunload", unloadCallback);
}, []);

第一节第一节第一节第一节第一次

我觉得你在找这个。
https://dev.to/eons/detect-page-refresh-tab-close-and-route-change-with-react-router-v5-3pd
浏览器刷新、关闭选项卡以及后退和前进按钮都有说明。
试试这个：

useEffect(()=>{
    const unloadCallback = (event) => {      
        const e = event || window.event;
        //console.log(e)
        e.preventDefault();
        if (e) {
          e.returnValue = ''
        }
        return '';
          
    };
    
    window.addEventListener("beforeunload", unloadCallback);
    return () => {
      //cleanup function
      window.removeEventListener("beforeunload", unloadCallback);
    }
    
  },[])