vue-router - 为什么vue router会重新加载组件，当这个组件是一样的，但是目标路由是在另一个children级别定义的？

Question

很多人有一个疑问：如何在路由改变的时候重新加载组件，但是组件还是一样的？

我有相反的问题。组件被刷新，当“to”路由在不同的子级别时，“from”路由。

Vue 路由器 3.0.6。

这是为了从路由 BusinessCaseDetailInsert 替换为路由 BusinessCaseDetail：

this.$router.replace({ name: 'BusinessCaseDetail', params: { id: newData.BusinessCaseId } });

1）当“to”和“from”路由处于同一级别时，组件不刷新。这是可取的。

var businessCaseDetailRoutes = [
    {
        path: 'business-case-detail-:id',
        name: 'BusinessCaseDetail',
        component: () => import('@/components/panels/businesscases/businesscase-detail'),
        props: (route) => getBusinessCaseDetailProps(route)
    },
    {
        path: 'business-case-insert',
        name: 'BusinessCaseDetailInsert',
        component: () => import('@/components/panels/businesscases/businesscase-detail')
    }
];

2) 当“to”和“from”路由不在同一级别时，组件被刷新。这是不可取的。:-(

var businessCaseDetailRoutes = [
    {
        path: 'business-case-detail-:idbc',
        component: '<router-view></router-view>',
        children: [
            {
                path: '',
                name: 'BusinessCaseDetail',
                component: () => import('@/components/panels/businesscases/businesscase-detail'),
                props: (route) => getBusinessCaseDetailProps(route)
            },
            {
                ...
            }
        ]
    },
    {
        path: 'business-case-insert',
        name: 'BusinessCaseDetailInsert',
        component: () => import('@/components/panels/businesscases/businesscase-detail')
    }
];

当目标路由定义在不同的子级时，我需要避免刷新组件。

标签： vue-router