如何强制 Vue 在路由更改时销毁并重新创建组件？答案

【问题标题】：How to force Vue to destroy and re-create the component on route change?如何强制 Vue 在路由更改时销毁并重新创建组件？
【发布时间】：2021-02-17 07:16:59
【问题描述】：

我在 Vue 路由器中的路由：

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

如您所见，我在两条路由上渲染了相同的 Vue 组件 Detail.vue。

我如何“强制”Vue 销毁并重新创建 Detail.vue 组件当 URL 更改例如从 /articles/5/edit 到 /articles/create ？

【问题讨论】：

标签： vue.js components render rerender

【解决方案1】：

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

请注意，这只强制路由器销毁/创建组件，对路由器挂钩没有影响 - 例如，beforeEnter 挂钩不会被调用，即使目标组件被销毁并创建新组件...

【讨论】：