现在路由层面权限的控制代码都在 @/permission.js 中,如果想修改逻辑,直接在适当的判断逻辑中 next() 释放钩子即可。
时间: 2024-02-09 09:11:44 浏览: 66
`@/permission.js` 中的代码用于进行路由层面的权限控制。它通过在路由导航过程中拦截路由请求,判断当前用户是否具有访问该路由的权限,如果没有,则重定向到登录页或者 404 页面。
如果您需要修改权限控制的逻辑,可以在 `@/permission.js` 中找到相应的代码进行修改。例如,如果您需要根据用户的角色来控制路由访问权限,可以在 `@/permission.js` 中添加一个判断逻辑,在适当的情况下调用 `next()` 释放钩子。
以下是一个示例代码:
```
import router from './router'
import store from './store'
router.beforeEach(async (to, from, next) => {
const hasRoles = store.getters.roles && store.getters.roles.length > 0
if (hasRoles) {
// 如果已经获取到用户角色信息,则继续执行路由导航
next()
} else {
try {
// 如果没有获取到用户角色信息,则尝试获取
const { roles } = await store.dispatch('user/getUserInfo')
const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
// 根据用户角色信息动态生成路由配置
router.addRoutes(accessRoutes)
next({ ...to, replace: true }) // 重新导航到目标路由
} catch (error) {
// 获取用户角色信息失败,重定向到登录页
await store.dispatch('user/resetToken')
next(`/login?redirect=${to.path}`)
}
}
})
```
在上面的示例代码中,我们在 `beforeEach` 钩子函数中添加了一个判断逻辑,如果用户已经获取到角色信息,则直接调用 `next()` 释放钩子;否则,我们尝试获取用户角色信息,并根据用户角色信息动态生成路由配置。最后,我们重新导航到目标路由,或者重定向到登录页。
需要注意的是,在修改路由层面的权限控制逻辑时,我们需要确保代码的正确性和安全性,并进行充分的测试和验证。
阅读全文