vue.js - Vue.js组件在导航更改上的重用-寻求澄清

Question

在下面的示例中，如果用户从/user/foo导航到/another_page，然后再导航到/user/bar，是否将重用User组件？

const User = {
   template: '<div>User</div>'
}

const router = new VueRouter({
  routes: [
    { path: '/user/:id', component: User }
  ]
})

Vue路由器手册说...

One thing to note when using routes with params is that when the user navigates from /user/foo to /user/bar, the same component instance will be reused. Since both routes render the same component, this is more efficient than destroying the old instance and then creating a new one. However, this also means that the lifecycle hooks of the component will not be called.

Dynamic Route Matching

...但是尚不清楚是否仅在没有中间导航步骤时才重用该组件。是否有任何文档详细讨论组件重用？

谢谢!

Answer 1

如果您从/user/foo导航到/user/bar，则该组件将被重用。
例如，在显示产品页面时经常使用。 请注意，如果需要，可以通过多种方法重建component。

如果您要从/user/foo导航到/another_page，然后导航到/user/bar，则您的component在离开/another_page时将被销毁，而在导航到/user/bar时将被创建。

总结一下:
/user/foo -> /another_page-组件被破坏
/user/foo -> /user/bar-组件将被重用