How to reset a component to its original state?

Question

Vue.js

The component has a form. After a successful submission, the form is replaced divwith a successful submission message. The switch from the form window to the message window occurs when the flag is changed isSubmittedfrom false to true .
In addition to the message that the form has been submitted, the user is prompted to either go to another page, or fill out and submit the form again, but with different data.
The question is how to reset the entire component to its original state? So that all inputs are erased, the isSubmitted flag becomes false again, and all other variables return to their default state? Now I do it through the tag<a>, which directs to the same page. But I don't like the fact that the page is being re-rendered, and especially the fact that it flickers.
In turn, assigning to all variables that are used in the component, their default value also seems to me not the best idea.
What would you suggest in this situation?

Answer 1

assigning to all variables that are used in the component, their default value also seems to me not the best idea

Are there any other objections to this method besides "it seems"?
If you are not satisfied with the amount of code, put it in a separate method that will be called when creating an instance of the component and when the values ​​need to be reset.