阅读量:0
在React中，可以使用window.addEventListener方法来添加beforeunload事件监听器。当用户试图离开当前页面时，会触发beforeunload事件。你可以在事件处理函数中执行一些操作，例如弹出确认对话框。
下面是一个简单的示例：
import React, { useEffect } from 'react'; function App() { useEffect(() => { // 添加 beforeunload 事件监听器 const handleBeforeUnload = (event) => { // 设置返回值，这将触发浏览器弹出一个确认对话框 event.returnValue = '你确定要离开此页面吗？'; }; window.addEventListener('beforeunload', handleBeforeUnload); // 在组件卸载时移除事件监听器 return () => { window.removeEventListener('beforeunload', handleBeforeUnload); }; }, []); return ( <div> <h1>React beforeunload 示例</h1> </div> ); } export default App; 请注意，某些浏览器可能不会显示自定义的确认对话框，而是显示默认的对话框。这是为了防止滥用beforeunload事件。
