vue 权限管理

使用vue-router的meta，其中requireLogin表示该组件需要登录，也可以根据实际需求增加不同的状态

    {
      path: '/main-page',
      name: 'MainPage',
      component: MainPage,
      meta: {
        requireLogin: true
      }

在beforeEach中监听路由改变，如果目标组件需要登录，则根据情况跳转页面

router.beforeEach((to, from, next) => {
    // console.log(to, from, next)
    console.log(
      to.meta
    )

    if (to.meta.requireLogin) {
      console.log('该组件需要登录权限');
      // 跳转到登录页面
      // next('/login')
      next({name: 'login'})
    }
    next()

  }
)