在根目录下创建一个permssion.js
在mainjs里面引入
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import '@/styles/index.scss'
import * as filters from './filters/index'
Vue.use(ElementUI);
import './permission'
Vue.config.productionTip = false
Object.keys(filters).forEach(key=>{
Vue.filter(key,filters[key])
})
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
import router from './router'
import store from './store'
router.beforeEach(async(to,from,next)=>{
if(to.path=='/login'){
next();
}else {
var hasRoles = store && store.getters.roles && store.getters.roles.length>0;
console.log(111);
if(hasRoles){
next()
}else {
try{
let {roles} = await store.dispatch('USERINFO');
let roleName = roles.map(n =>n.name);
let asyncRoutes = await store.dispatch('GENERATEROUTES',roleName);
console.log(asyncRoutes);
router.addRoutes(asyncRoutes);
console.log(222);
if(roles){
next({...to});
}else {
next({path:'/login'});
}
} catch(error){
console.log(444);
next({path:'/login'})
}
}
}
})