• vue-router封装和用户是否需要登录


    vue-router封装和用户是否需要登录
    
    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')
      }
    
    ]
    export default new Router({
      routes
    })
    
    //路由拦截器写到mian.js
    
    router.beforeEach((to, from, next) => {
      const username = Cookies.get('username');
      if (to.meta.requireAuth) {  // 判断该路由是否需要登录权限
        if (username) { // 判断本地是否存在username
          next()
        } else {
          // 未登录,跳转到登陆页面
          next({
            path: '/'
          })
        }
      } else {
        next();
      }
    })
  • 相关阅读:
    分享ASP.NET+jQuery MiniUI后台购物管理
    ASP.NET发送电子邮件
    LINQ学习(三):Where子句
    ASP.NET配置KindEditor文本编辑器
    一步步写自己SqlHelper类库(五):Command对象
    ASP.NET生成静态页面的简单实现
    兼职开发悟出的点点滴滴
    设计模式学习笔记
    if else替代者
    ASP.NET 一生命周期中的额事件
  • 原文地址:https://www.cnblogs.com/wulicute-TS/p/14749855.html
Copyright © 2020-2023  润新知