reactjsreact-hooksbackunmount

How to set a leaving warning with react hooks?

I'm making a application that needs to show the progress will be lost if you hit back.

I did use the useEffect hook:

 useEffect(() => {
        return () => {
          showWarning();
        }
  }, [])

which function can I use to stop this back action so I can show my warning and confirm?

Solution

  • If you are using the react-router, you have Prompt to handle this kind of behavior. You have more information here: https://reactrouter.com/core/api/Prompt