Vue version

3.2.45

Link to minimal reproduction

https://codesandbox.io/s/sparkling-firefly-fq9ev9

Steps to reproduce

Press links B and C, all works fine. After A pressed, nor B or C can't be opened

What is expected?

In case page A can't be rendered because of error, user should be able to return back to correctly working page

What is actually happening?

Going between B and C links works fine, until A link is opened. After that B and C can't be opened as well

System Info

No response

Any additional comments?

No response

You should be using the global error handler or a local one to gracefully handle errors.

you could do so at the route level by writing a small ErrorBoundary Component that handles errors and provides a fallback:

<router-view v-slot="{ component } ">
  <error-boundary>
    <component :is="component"  />
    <template #fallback>
      <h1>an error occurred!</h1>
    </template>
  </error-boundary>
</component>

Please use our discord or this repository's Discussion feature to ask for help if you need any.