vue2路由拦截

这是一个剪刀的路由拦截

router分位两个文件，一个是路由统一配置，一个是具体的路由信息

1路由拦截

import Vue from 'vue'

import VueRouter from 'vue-router'

import routes from './index.config'

import { routerList } from '@/common/js/url-white-list'

Vue.use(VueRouter)

const router = new VueRouter({

mode: 'hash',

// mode: 'history',

base: __dirname,

routes,

//在顶部点击当前路由菜单回到顶部

scrollBehavior() {

return {

x: 0,

y: 0

}

/* 跳转页面返回顶部 */

}

})

 

router.beforeEach((to, from, next) => { //简单的判断

// 百度统计，上报数据

if (window._hmt) {

if (to.path) {

// eslint-disable-next-line

window._hmt.push(['_trackPageview', '/#' + to.fullPath]);

}

}

let roleType = window.localStorage.getItem('roleType');   //用户角色

// let url = window.location.hash ? window.location.hash.split('#')[1] : 

const token = window.localStorage.getItem("access_token")//是否登录

let openid = window.localStorage.getItem("openid");

if (routerList.indexOf(to.path) === -1) { //不需要登录后回来的地址 比如修改密码页面

window.localStorage.setItem('redirectUrl', to.path);   //记录未登录之前从哪个菜单点击的登录的，登录成功之后跳转到这个页面

if (!to.meta.requireAuth && !token && !openid) {   //如果用户未登录没有openid又不需要用户登录的页面 比如微官网的页面 到登录页面之后进入beforeRouteEnter之后用户未绑定登录关系需要返回的页面

window.localStorage.setItem('landingUrl', to.path);

}

}

if ((to.meta.requireAuth || !openid) && routerList.indexOf(to.path) === -1) {

if (!token) {

document.title = "登录";

next({

path: '/login',

});

} else if (roleType && to.meta.role.indexOf(roleType) === -1) {   //没权限

if (to.meta.requireRole) { //暂无权限

document.title = "能源e+";

next({

path: '/jurisd',

});

// Toast({ message: '您没有访问权限', duration: 1000 })

}

} else {

document.title = to.meta.title;

next();

}

} else {

document.title = to.meta.title;

next();

}

});

export default router

转载于:https://www.cnblogs.com/dmwcq/p/11180724.html