在 Vue 组件之外访问 VueRouter

2024-01-03

是否可以在 Vue 组件之外访问 VueRouter。

我尝试过在 JavaScript 文件中导入 Vue。在这个文件中我可以访问Vue.http但不是Vue.router or Vue.$router。最后 2 个返回未定义。

main.js

import Vue from 'vue'
import VueResource from 'vue-resource'
import VueRouter from 'vue-router'

import routes from './config/routes'
import store from './store'
import * as rootUrl from './config/rootUrl'



//Routing support
Vue.use(VueRouter);
//Backend support
Vue.use(VueResource);

const router = new VueRouter({
    mode: 'history',
    routes: routes
})

new Vue({
    store,
    router,
}).$mount('#app')

Vue.http.get(rootUrl.url, {Accept: "application/json"}).then(response => {
    let data = response.body
    store.commit('SET_APP_DATA', { data: {
        'title': data.title,
        'peopleUrl': data.people,
        'eventsUrl':  data.events
    }})
    store.commit('SET_READY')
})

我仅从组件中使用它,但如果您使用通用样板,其中路由在 router/index.js 下定义,那么您可以尝试以下操作,然后将其导入,如下所示:

import Router from '../router'; 

之后可以在代码中使用它,例如

Router.push('/mypage')

不确定它是否有效,但尝试一下。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Vue 组件之外访问 VueRouter 的相关文章

随机推荐