Laravel 基于用户类型的Vuejs路由加载

我在所有组件中返回用户类型，但我需要在路由中添加对它的验证，不知道如何添加

密码 这是我的route.js文件，其中我需要用户进行身份验证的路由在meta中定义

正如您所看到的，我有requireAuth:true，它只允许经过身份验证的用户访问此路由，我还需要添加另一个值，该值表示如果user type==admin，则并非所有登录的用户都可以访问此路由，但只有管理员可以访问

这是我记录的用户信息，可在所有组件中访问，并包含在类型值中

问题 如何将用户类型添加到元路由

注

我的类型值可以是这3种情况之一

管理员角色 客户或任何其他用户角色 未定义用户，未分配角色 使现代化 忘了提到在我所有的组件中我也有这个功能

beforeRouteEnter (to, from, next) {
  const token = localStorage.getItem('access_token')
  return token ? next() : next('/login')
},

这只是检查我的用户是否基于本地存储中保存的令牌登录

更新2 我还尝试在组件函数中获取我的用户类型，如下面的代码，但返回了此代码。$store未定义

beforeRouteEnter (to, from, next) {
    if (this.$store.getters.loggedUser.type != 'admin') {
        next({
            name: 'home'
        })
    } else {
        next()
    }
}

此组件实例在beforeRouteEnter中不可用

一种方法是向管理路由添加另一个元属性，并检查每个包含admin:true的路由的用户类型

您的路由器代码如下所示：

const router = new VueRouter({
    mode: "history",
    routes: [
        // ADMIN ROUTES
        {
            path: '/dashboard',
            name: 'dashboard',
            component: Dashboard,
            meta: {
                requiresAuth: true,
                layout: 'admin',
                admin: true
            }
        },
    ]
});

router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requiresAuth)) {
        if (!store.getters.isLoggedIn) {
            next({
                name: 'login'
            })
        } 
    }
    if (to.matched.some(record => record.meta.admin)) {
        if (store.getters.loggedUser.type !== 'admin') {
            // Do something if the user is not an admin
            // maybe redirect to a forbidden page
        }
    }
    next() 
})

---

您是否将用户存储在vuex中？您可以在输入之前检查store.getters.user.type。@dubonzi是的，我在更新部件代码中尝试过这样做，但它说store未定义，不确定还需要什么do@dubonzi更新了我的问题组件实例这在beforeRouteEnter中不可用。你应该在route.js-router.beforeachyeah中检查一下，我会添加一个答案。奇怪的是，它会将我重定向到主页，即使我的用户类型是admin！嗨，你能告诉我这张唱片代表什么吗？@LiuYu嗨，它是基于路由器的。我的代码有一个输入错误。如果store.getters.loggedUser.type！='管理员'删除！在start@dubonzi嗨，伙计，还记得你的回答吗这给我带来了一点问题，我在这里解释过。我想知道你是否可以检查一下，并给我一些建议？

const router = new VueRouter({
    mode: "history",
    routes: [
        // ADMIN ROUTES
        {
            path: '/dashboard',
            name: 'dashboard',
            component: Dashboard,
            meta: {
                requiresAuth: true,
                layout: 'admin',
                admin: true
            }
        },
    ]
});

router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requiresAuth)) {
        if (!store.getters.isLoggedIn) {
            next({
                name: 'login'
            })
        } 
    }
    if (to.matched.some(record => record.meta.admin)) {
        if (store.getters.loggedUser.type !== 'admin') {
            // Do something if the user is not an admin
            // maybe redirect to a forbidden page
        }
    }
    next() 
})