Search code examples
reactjsreact-routerreact-router-v4

React router v4 get user confirmation when leaving page

In older versions I could use setRouteLeaveHook within my component.

For example (SO): Detecting user leaving page

With react router v4 the logic has changed away from injecting the router itself into the components and I only found the following function on router v4:

BrowserRouter. getUserConfirmation

I am a little bit confused, why I should link the confirm behavior with the Router itself and not with a specific component!?

How can I place a confirm window, when leaving my component (linked to my current route), while being in a certain state? This seems to be not supported by the function above.

Solution

  • I think the Prompt component is what you're looking for. Just render it in the component you want to confirm navigation form, i.e. the same component you render in your <Route>.