Skip to content
🚪 React component and hook which listens to `beforeunload` on the window when mounted.
JavaScript
Branch: master
Clone or download
dependabot and jacobbuck Bump lodash from 4.17.11 to 4.17.15 (#11)
Bumps [lodash](https://github.com/lodash/lodash) from 4.17.11 to 4.17.15.
- [Release notes](https://github.com/lodash/lodash/releases)
- [Commits](lodash/lodash@4.17.11...4.17.15)

Signed-off-by: dependabot[bot] <support@github.com>
Latest commit 7988429 Aug 31, 2019

readme.md

react-beforeunload

React component and hook which listens to beforeunload on the window when mounted.

Usage

useBeforeunload Hook (recommended)

import { useBeforeunload } from 'react-beforeunload';

Display a dialog box:

useBeforeunload(event => event.preventDefault());

Display a dialog box with custom message:

useBeforeunload(() => "You'll lose your data!");

Some browsers display the returned string in the dialog box, others display a fixed message.

Source

Beforeunload Component

import { Beforeunload } from 'react-beforeunload';

And use as you would use the hook:

<Beforeunload onBeforeunload={event => event.preventDefault()} />
<Beforeunload onBeforeunload={() => "You'll lose your data!"} />

Alternatively use it as a wrapper:

<Beforeunload onBeforeunload={}>
  <MyApp />
</Beforeunload>

Requirements

Requires a minimum of React version 16.8.0. If you're on an older version of React, then checkout v1.

You can’t perform that action at this time.