Отображает сообщение, когда вкладка закрыта по статусу состояния в React

Question

Когда я выполняю определенный c процесс и хочу, чтобы пользователь случайно не закрыл вкладку или не перезагрузил страницу

, мне нужно предупредить его, когда он закроет вкладку, как только процесс продолжается

После завершения процесса я хотел бы отменить сообщение

Как я могу это сделать?

Answer 1

После поиска я нашел код, который это делает

const [state, setState] = React.useState(false);
  useEffect(() => {
    const cb = e => {
      if (state) {
        console.log({ s: state });
        e.preventDefault();
        e.returnValue = "Are you sure?";
      }
    };
    window.addEventListener("beforeunload", cb);
    return () => window.removeEventListener("beforeunload", cb);
  }, [state]);

Прилагаю пример

codeandbox