Vue.js 从actions.ts访问vue路由器

如何从actions.ts文件中访问Vue路由器实例

this.$router

和

this.$route

在以下上下文中不可用：

boot.ts：

从“Vue”导入Vue；
从“vue路由器”导入VueRouter；
从“./routes”导入路由；
从“./services/store”导入存储
从“日志级别”导入*作为日志
Vue.use（VueRouter）；
log.setLevel（“跟踪”）；
常量路由器=新的VueRouter({
路线，
linkActiveClass：“活动”
});
新Vue({
el:“#应用程序根”，
路由器:路由器,，
店:店,，
render:h=>h（需要（'./layouts/app.vue.html'））
});

行动3.ts：

从“/http”导入{http，httpClass}；
从“../models/domainApps”导入{DomainAppModel}；
从“Vue”导入Vue；
var操作={
注销：函数（{commit}，params）{
返回新承诺（（解决、拒绝）=>{
http.logout（）.then（结果=>{
提交（“清除状态”）；
//此.$路由器和此.$路由不可用
这是$router.push({
路径：“登录”，
查询：{
sessionTimedout:对，
重定向：此路径为$route.fullPath
}
});
});
});      
}
}
导出默认操作

$router:

要在“存储操作”中访问

$router

，您可以这样做：

import router from './router';

// then use the router like this
router.push({path: 'login'})

将路由器声明移动到名为

router.ts的单独文件中

const router = new VueRouter({
  routes,
  linkActiveClass: "active"
});
export default router;

在

actions.ts

中导入您的

路由器

，并使用它而不是

this。$router

如下所示：

import router from './router';

// then use the router like this
router.push({path: 'login'})

$route.fullPath

关于

$route.fullPath

，可以在调度操作时将其作为有效负载的属性传递

this.$store.dispatch('LOGOUT', {redirectPath: this.$route.fullPath})

然后在

注销

操作中这样使用它

router.push({path:"login", query: {
  sessionTimedout: true,
  redirect: params.redirectPath
}});

---

解析

中的
Promise
。然后通过
Resolve（）
处理程序解析
handler，然后在调度操作的任何位置：
this.$store.dispatch（'LOGOUT'，params）。然后（（）=>this.$router.push（{…}）