useBeforeLeave

useBeforeLeave takes a function that will be called prior to leaving a route. The function will be called with:

• from (Location): current location (before change).
• to (string | number}: path passed to navigate.
• options (NavigateOptions}: options passed to navigate.
• preventDefault (void function): call to block the route change.
• defaultPrevented (readonly boolean): true if any previously called leave handlers called preventDefault().
• retry (void function, force?: boolean ): call to retry the same navigation. Pass true to skip running the leave handlers again (ie. force navigate without confirming).

Example usage:

useBeforeLeave((e: BeforeLeaveEventArgs) => {
  if (form.isDirty && !e.defaultPrevented) {
    // preventDefault to block immediately and prompt user async
    e.preventDefault();
    setTimeout(() => {
      if (window.confirm("Discard unsaved changes - are you sure?")) {
        // user wants to proceed anyway so retry with force=true
        e.retry(true);
      }
    }, 100);
  }
});