When you navigate between the pages in the application, the transition to the new route occurs instantly. However, there are scenarios in which you want to prevent this transition based on the state of the application. One such common example is when a user has entered data into form fields and has spent several minutes (or hours) filling up the form data. If the user clicks on a navigation link accidentally, all the data entered in the form will be lost. The user should be notified of this route navigation, so that the user gets a chance to save the data entered into the form.
Traditional websites keep track of the state of the form and display a confirmation message when the user tries to navigate away from a page that contains a form that has not been submitted to the server. In these scenarios, a confirmation dialog box is shown with...