useBeforeUnload

React 副作用钩子,当用户试图重新加载或关闭页面时显示浏览器警报。

Usage

  1. import {useBeforeUnload} from 'react-use';
  2. const Demo = () => {
  3. const [dirty, toggleDirty] = useToggle(false);
  4. useBeforeUnload(dirty, 'You have unsaved changes, are you sure?');
  5. return (
  6. <div>
  7. {dirty && <p>Try to reload or close tab</p>}
  8. <button onClick={() => toggleDirty()}>{dirty ? 'Disable' : 'Enable'}</button>
  9. </div>
  10. );
  11. };