Javascript 重新评估vue路由更改上的动态导入

我正在制作一个管理面板，用于管理几个网站。我的vue路由器路由都以网站slug作为前缀，我在路由器上有一个beforeach，它将

网站slug

相应地设置为vuex状态

每个站点都将使用大部分相同的组件，但也有几个站点具有自定义页面组件

对于这种情况，我创建了一个名为

importOrDefault

的函数，如下所示：

const importOrDefault = (componentName, store) => {
    return import(/* webpackChunkName: "[request]" */ `./Pages/${store.getters.website.slug}/${componentName}`)
        .catch(() => import(/* webpackChunkName: "[request]" */ `./Pages/_shared/${componentName}`));
};

{
    path: '/:website_slug/',
    name: 'dashboard',
    component: () => importOrDefault('Dashboard', store)
}

我在路由器配置中使用的配置如下：

const importOrDefault = (componentName, store) => {
    return import(/* webpackChunkName: "[request]" */ `./Pages/${store.getters.website.slug}/${componentName}`)
        .catch(() => import(/* webpackChunkName: "[request]" */ `./Pages/_shared/${componentName}`));
};

{
    path: '/:website_slug/',
    name: 'dashboard',
    component: () => importOrDefault('Dashboard', store)
}

此设置在加载时效果非常好。但是，当我导航到另一个

：website_slug

时，不会重新评估该组件，并加载与上一个站点相同的组件。不过，国家已经发生了变化，所以这不是问题所在

---

有没有一种方法可以让路由器组件重新评估功能，或者我缺少一些可以用于此的明显功能？

Vue路由器尝试尽可能多地重用组件。您是否尝试过在路由更新之前将

添加到组件以明确设置数据（vs使用mounted或其他方式）？您还可以将组件的
键
属性设置为明确的值（如
网站\u slug
值），以确保组件不会被重用

我个人更喜欢在可能的时候使用
键

见：

路由更新之前
方法：

键
方法：
我尝试了几种解决方案，但无法让路由组件重新评估。最终，我在引导Vue之前加载了可用的网站，并为所有网站生成了所有可能的路由

通过这种方式，另一个网站的同一页面是唯一的路由，每个网站都会对组件进行评估。
我已经尝试了两种方法，并且
网站\u slug
已经设置为
路由器视图的
：键
。问题是返回组件（
importOrDefault
）的函数没有再次求值，这意味着始终使用相同的组件。这可能有点老套，可能会以不同的方式解决问题，但您能否创建自己的“路由”组件，使组件始终在路由上返回，然后使用其中的模板逻辑根据
网站\u slug
？