5

My routes in Vue router:

{ path: 'articles/create', component: () => import('Detail.vue') },
{ path: 'articles/:id/edit', component: () => import('Detail.vue') },

As you can see, I render the same Vue component Detail.vue on both routes.

How do I "force" Vue to destroy & re-create the Detail.vue component when the URL changes from for example /articles/5/edit to /articles/create ?

Michal Levý
  • 33,064
  • 4
  • 68
  • 86
mspiderv
  • 509
  • 7
  • 15

1 Answers1

7
<router-view :key="$route.fullPath" />

Just be aware that this only forces router to destroy/create component and has no effect on router hooks - for example beforeEnter hook will not be called even that target component is destroyed and new one is created...

Michal Levý
  • 33,064
  • 4
  • 68
  • 86