vue router 非组件之间跳转

Question

要实现在的项目功能我需要在我自己登录网关做一个判断我封装了一个axios 而这个涵数库每一次都会请求后端网络并返回状态码当返回状态为：“登录超时” 时 我router跳转 而不是window.location='/login'相关代码import Vue from 'vue'import router from 'vue-router'import axios from 'axios'; Vue.prototype.$ajax = axios//这个是我封装的一个axiosexport default function(url,data={}){     ...这里做一些网络请求使用...    if(登录超时){         ...router跳转...//如果在这里进行跳转         /*router.push('无效')*/     } }

Answer 1

此处的router是并不是import Router from 'vue-router'的Router依赖.
它实际上是路由进行统一管理后导出的一个router对象.

// router.jsimport Router from "vue-router";import Home from 'Home.vue'Vue.use(Router);// 导出的routerexport default new Router({    routes: [
        {          path: "/",          name: "home",          component: Home,          children: [
            {              path: "/a",              name: "a",              component: A
            }
        ]
})

在你需要的页面上,通过引入这样的对象实例,然后使用router.push方法

// 需要调用的js文件// 引入router.js的对象import router from 'router.js'...
...
func(){
...
    router.push('/');
...    
}




Answer 2

封装的文件是不是在单独的 js 文件中，你可能需要把 router 引进去才能用 router.push

import {router} from '@/router/index'

router/index.js

import Vue from 'vue'import iView from 'iview'import VueRouter from 'vue-router'import Cookies from 'js-cookie'import { routers } from './router'Vue.use(VueRouter)const RouterConfig = {  mode: 'history',  routes: routers
}export const router = new VueRouter(RouterConfig)

你需要的是 new VueRouter 后的这个对象。