问题描述
我们知道,@angular/router 提供了 RouteGuard 用来做路由导航权限控制功能,并提供了 CanActivate 和 CanActivateChild 两种 guard,使用方式如:
routes = [
{
path: 'advisors/:id',
component: AdvisorComponent,
canActivate: [AuthGuard], // AuthGuard 判断用户是否登录
canActivateChild: [AuthGuard], // 是否注释
children: [
{
path: 'households/:id',
component: HouseholdComponent,
// canActivate: [AuthGuard],
},
{
path: 'contacts',
component: ContactComponent,
// canActivate: [AuthGuard],
}
]
}
];
这样,当从 route1 advisors/1/households/1
切换为 route2 advisors/1/households/2
时,还会执行 AuthGuard 来判断用户是否登录,否则导航失败。如果注释掉 canActivateChild: [AuthGuard]
,从 route1 切换到 route2 后,是不会运行 AuthGuard,因为 @angular/router 的 canActivate 被设计成只负责当前段(segment),只负责局部而不是全局(或者在每一个子段加上 canActivate: [AuthGuard]
)。
当然,route1 切换到 route2 肯定还是得运行 AuthGuard 来判断用户是否登录的。
几个问题
- 这种 canActivate 只负责当前段(segment)的设计会让代码有重复之嫌,为什么不设计成当 route1 切换到 route2 时,还是会执行父段 canActivate 中的 AuthGuard?这个设计有什么特别的理由吗?
- Router 在 run guard 的内部详细过程是什么?(承认这个问题有点过大和宽泛)