猿记录

一个记录、分享的博客

您的位置:主页 > 技术专栏 > javascript > vue >

vue 登录权限控制

2017-10-11 17:26:40 作者:yxl 次阅读 vue

import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/components/Home'
import Login from '@/components/Login'
import Error from '@/components/Error'
import store from '@/vuex/store'

Vue.use(Router)

const router = new Router({
mode:'history',
routes: [
{
path: '/',
name: 'home',
meta:{auth:true},
component: Home
},{
path:'/login',
name:'login',
meta:{auth:false},
component:Login
},{
path:'*',
component:Error
}
]
})
//路由权限处理
router.beforeEach(({meta,path},from,next)=>{
//如果meta 是有设置的话 就是使用meta中的属性 没有就是用 auth=true 就是要权限
let {auth=true}=meta
let isLogin = Boolean(store.state.isLogin)
/*
访问不需要权限的设置meta:false
注册也要设置成meta:false
*/
if(auth&&!isLogin&&path!== '/login'){
next({path:'/login'});
}
if(isLogin&&(path=='/login')){
next({path:'/'})
}
next();
 
})

export default router

凡本站注明“本站”或“投稿”的所有文章,版权均属于本站或投稿人,未经本站授权不得转载、摘编或利用其它方式使用上述作品。

编辑:yxl 关键词: Vue
0

网友评论