vue-router 鉴权 守卫

vue-router 鉴权 守卫

---

1.先在permission.js中:

//路由配置文件
import router from './router'
import store from './store'
//需要安装nprogress
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
//禁用进度环
NProgress.configure({ showSpinner: false })
 
// 路由白名单
const whiteList = ['/login']
//全局前置守卫
router.beforeEach((to, from, next) => {
  NProgress.start()
  //注意，要过滤掉/login路径，不是的话会造成无限next()死循环
  if (to.path === '/login') {
  	return
  }
  //路由白名单直接跳过
  if (whiteList.indexOf(to.path) !== -1) {
    next();
    return;
  }
  
  //鉴权拦截操作
  let token = localStorage.getItem('token')
  if (token) {
	let permissions = store.getters.permissions
	if (!permissions || permissions.length === 0) {
	 store.dispatch('GetUserPermissions').then( async () => {
        next({ ...to, replace: true })
      }).catch(err