Vue.js 基于路由参数在启动时加载Vuex状态

我有一个Vue应用程序，其中有许多带有

tenantId

参数的路由。当第一次加载应用程序时，我必须从route中获取

tenantId

值，从API加载数据并用它初始化Veux存储

我不应该显示任何路由器视图组件，因为它假定初始状态已加载

因此，我尝试在

App.vue

创建的
中实现它，
挂载的
钩子没有运气，因为
$route
在那个阶段是空的<对于
App.vue
，不调用code>beforeRouteEnter
。在
路由器
模块的
之前的
内部，我没有对存储的引用

这种初始化的正确位置是什么？
您可以在
app.js
或
main.js
文件（初始化Vue的入口点）中引用Vuex存储。类似的操作应该可以（未经测试）

从“Vue”导入Vue
从“Vuex”导入Vuex
从“vue路由器”导入VueRouter
Vue.use（Vuex）
Vue.use（VueRouter）
常量路由器=新的VueRouter({
模式：“历史”，
路线：[
//这里的路线
]
})
const store=新的Vuex.store({
声明：{
租户：空，
},
突变：{
setTenant：（state，tenantId）=>（state.tenantId=tenantId）
}
})
const split=window.location.pathname.split（“/”）
//查找租户的索引
//您也可以使用RegEx进行此操作
const tenantId=//
store.commit（'setTenant'，tenantId）
const app=新的Vue({
el:“#应用程序”，
路由器，
商店
})
对我有效的解决方案是在App.vue中的每个
之前添加一个
，在那里我还可以参考Vuex商店

//App.vue
创建（）{
此.$router.beforeach（异步（到，下一步）=>{
if（to.params&&to.params.tenantId）{
const id=parseInt（to.params.tenantId，10）；
if（id！=此$store.state.tenantId）{
const data=wait dataService.getById（id）；
此。设置_数据（数据）；
}
}
next（）；
});
}
谢谢您的回答。但在这种情况下，我将复制路由器的逻辑。如果对路由进行更改，我还需要将其保存在第二个文件中。是否可以“要求”路由器解析URL并解析参数？您不必这样做。您只需导入现有的
路由器
。