Stoping Refresh And Close Actions Of Browser In React Router With Custom Prompt

i have a form, so when the user clicks on refresh(ctrl + r, icon on the browser) or close button of the browser. I need to show a custom modal box not the browser prompt box. in th

Solution 1:

Unfortunately that's not possible (because there must always be a way for the user to close a tab/window).

The only thing you can do in onbeforeunload is

event.preventDefault();
event.returnValue = 'Some browsers display this to the user';

and it will then show the browser confirmation box. Depending on the browser, it may or may not show your custom message (if they don't, it's sometimes used for deceptive purposes). Depending on configuration, the browser may not show the confirmation at all but just unload the page.