【问题标题】:Access router instance from my service从我的服务访问路由器实例
【发布时间】:2017-01-15 07:54:57
【问题描述】:

我创建了一个身份验证服务 (src/services/auth.js),只有函数和属性..

export default {
    login() { ... }
    ...
}

login函数内部,我需要重定向用户

router.go(redirect)

如何检索路由器实例


上下文

在我的src/main.js 文件中,我创建了一个路由器..

import VueRouter from 'vue-router'
Vue.use(VueRouter)
import route from './routes'
const router = new VueRouter({
  history: false,
  linkActiveClass: 'active'
})
route(router)

const App = Vue.extend(require('./App.vue'))

在我的src/routers.js 中只是地图路线

export default function configRouter (router) {
    router.map({ .. })
}

【问题讨论】:

    标签: vue.js vue-router


    【解决方案1】:

    您应该导出router 实例,然后将其导入auth.js 服务。

    这是我的一些改进的解决方法:

    src/routes.js

    export default {
      '/': {
        component: {...}
      },
      '/about': {
        component: {...}
      },
      ...
    }
    

    src/router.js

    import Vue from 'vue'
    import VueRouter from 'vue-router'
    import Routes from './routes'
    
    Vue.use(VueRouter)
    
    const router = new VueRouter({...})
    
    router.map(Routes)
    
    // export the router instance
    export default router
    

    src/main.js

    import Router from './router'
    import App from './app'
    
    Router.start(App, '#app')
    

    src/services/auth.js

    import Router from '../router'
    
    export default {
      login () {
        // redirect
        Router.go('path')
      }
    }
    

    【讨论】:

    • Vue.use() 创建的 vue-router 实例与下一行创建的实例不同吗?
    【解决方案2】:

    您的身份验证服务是 Vue 组件吗?

    如果是这样,您应该可以通过以下方式更改路线:

    this.$router.go('/new/route');
    

    【讨论】:

    • 嘿@Dan,不...我的 auth.js 它只是一个模块。
    猜你喜欢
    • 2010-11-08
    • 2012-12-19
    • 1970-01-01
    • 1970-01-01
    • 2018-01-22
    • 2023-04-01
    • 1970-01-01
    • 2017-05-19
    • 2018-04-12
    相关资源
    最近更新 更多