ReactJS - предупреждающее сообщение, когда WebBrowser нажимает кнопку вперед / назад / обновление

Question

Мне нужно реализовать скрипт / функцию в ReactJS, которая запрещает пользователю Вернуться или Обновить или Перейти вперед фактическая страница приложения в ReactJS безподтверждающее предупреждающее сообщение.

Мой дом: localhost: 3000 / Страница возобновления: localhost: 3000 / резюме

Если пользователь находится на странице /resume, а затем случайно или преднамеренно попытаться обновить, вернуться назад или продолжить работу, используя типичные элементы управления WebBrowser, приложение в ReactJS обнаружит действие и отобразит предупреждающее сообщение, например: ex "Вау! Ты"Вы пытаетесь покинуть страницу, и если вы продолжите, вы можете потерять все данные. Вы уверены, что продолжите? "

¿Есть идеи о том, как ее решить?

Большое спасибо в продвинутом.

Answer 1

Вы можете достичь этого, используя чистый JS.window.onbeforeunload как задокументировано здесь позволяет вам сделать что-то перед выгрузкой страницы или даже отменить само событие.

window.onbeforeunload = (e) => {
// Your alert logic could be invoked here...
};