vue-router封装

Posted 2021-01-18 92xcd

用户是否需要登录

import Vue from ‘vue‘
import Router from ‘vue-router‘

Vue.use(Router)
const routes = [{
　　path: ‘/‘,
　　redirect: ‘/home‘
　　},
　　{
　　　　path: ‘/home‘,
　　　　name: ‘home‘,
　　　　component: () =>import(‘./views/Home.vue‘),
　　　　meta: {
　　　　　　requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
　　　　},
　　　　children: [{
　　　　　　path: ‘/account_management‘,
　　　　　　name: ‘account_management‘,
　　　　　　component: () =>import(‘./views/admin/account_management.vue‘)
　　　　}]

　　},
　　{
　　　　path: ‘/login‘,
　　　　name: ‘login‘,
　　　　component: () =>
　　　　import(‘./views/login/login.vue‘)
　　}

]
const router = new Router({
　　routes
})
//路由拦截器
router.beforeEach((to, from, next) => {
　　//根据字段判断是否路由过滤
　　if(to.meta.requireAuth) { // 判断该路由是否需要登录权限
　　　　if(localStorage.getItem(‘sid‘)) { //身份信息获取
　　　　　　next();
　　　　} else {
　　　　　　next({
　　　　　　　　path: ‘/login‘
　　　　　　})
　　　　}
　　} else {
　　　　next();
　　}
});
export default router;