Refresh a Page in Vue

If you need to force a reload your entire page using Vue, all you need is some Javascript:

window.location.reload();

But this is a code smell — you should almost never need to use this method.

Instead, a better solution might be one of these:

  • Create a method to reset and initialize state instead of relying on onMounted hooks or the top-level of setup. You can also create an initialize action for Pinia.
  • Make sure your important state is reactive. This tends to fix a lot of common issues.
  • Key-changing — by changing just the key attribute on a specific component, you can force just one component to reload instead of your entire app. Still a bit of a hack, but it gets the job done.