根据用户角色将用户路由到不同目标网页的最佳方法是什么?而
我现在在做什么:在登录组件中,我有一个if-else并导航到相关页面。但是我在注册页面和各种页面的“主页”按钮中都有相同的逻辑。
有没有更好的方法通过更安全的角色来执行路由,例如在路由器本身内,而不必在整个地方重复相同的逻辑?
if (UserTypeEnum.TeacherUserType === userType.Value) {
this.router.navigate(["/teacher-landing/"]);
} else if (UserTypeEnum.StudentUserType === userType.Value) {
this.router.navigate(["/student-landing"]);
} else if (UserTypeEnum.AdminUserType === userType.Value) {
this.router.navigate(["/admin-landing"]);
} else {
this.router.navigate(["/login"]);
}
或者我可以将所有这些if-else合并到一个组件中,例如SecuredHome,并使用默认路由到此SecuredHome。
对于针对不同用户角色到目标网页的安全和更好的可扩展性进行更好设计的任何建议都表示赞赏。
谢谢!
答案 0 :(得分:0)
从性能的角度来看,Switch case语句比使用if-else更好。在单个组件中使用它,例如,可以在集成中使用SecuredHome。
答案 1 :(得分:0)
您可以创建NavigationService并将家庭导航逻辑放在那里。然后在要调用的组件中注入服务。通过这种方式,你不必重复逻辑。
答案 2 :(得分:0)
晚了几年,但我更喜欢映射解决方案。使它更干净地管理要检查的URL。不知道您的userType.Value
是否为枚举,但是如果需要可以将其转换为字符串。
const routeMap = {
TeacherUserType: '/teacher-landing/',
StudentUserType: '/student-landing',
AdminUserType: '/admin-landing'
}
const foundUrl = routeMap[userType.Value]
const url = foundUrl ? foundUrl : '/login'