Vue Router - 当子路由更改时为父组件调用 beforeDestroy

Question

我的路线是这样定义的

{
path: '/menu',
component: () => import('./Menu.vue'),
children: [
  {
    path: 'admin',
    component: () => import('./menus-admin/MenusAdmin.vue'),
    name: 'menusAdmin'
  },
  {
    path: 'import',
    component: () => import('./menus-admin/menus-import/MenusImport.vue'),
    name: 'menusImport'
  }
 ]
}

当我使用 router-link 组件在 admin 和 import 路由之间导航时，父 Menu.vue 组件被销毁并重新创建。我希望 Menu.vue 组件不会被破坏，除非我导航到一条完全不同的路线。这是一个问题，因为我已经实现了一些生命周期挂钩，我不想在子路由更改时一遍又一遍地调用它们。难道我做错了什么？这是错误还是功能？

Answer 1

我发现了我的问题。我的 <router-view> 上面有 :key="$route.fullPath"。这迫使它在每次路由更改时重新渲染所有内容。

删除它，它按预期工作。

Vue Router - 当子路由更改时为父组件调用 beforeDestroy

Vue Router - beforeDestroy is called for parent component when children route changes

webpack

vue.js

vue-router