Open zxdfe opened 2 years ago
Global guard:
Global Pre Guard (beforeEach): Invoked before navigation starts to check permissions and authenticate users
Global Resolution Guard (beforeResolve) : Called before navigation is confirmed, where asynchronous routing data, etc., can be processed.
Global afterEach: Called after navigation is complete and can be used for statistics, page scrolling, and other operations
Route Exclusive Guard (beforeEnter) : This parameter is defined in route configuration and written in a separate routing rule. This parameter is valid only for the current route and is used to guard the current route.
Component internal guard:
beforeRouterEnter: is the function that executes before the route switch enters the current page. It is called only before the component is activated (that is, initialized).
beforeRouterUpdate: Resends the request when changing routes dynamically.
beforeRouterLeave: This guard function is called when the user leaves the current page to save data before leaving.
Three parameters are accepted by default:
to: indicates the page route object to be jumped to
-Penny: from where
next: The function that controls the jump. Call the function next (' /xxx ') to perform the page jump. next(false) blocks
These guards are automatically triggered when the route changes. By using these guards, the data can be controlled and processed during route jump, and the necessary security authentication and user identification can be carried out. Using route guard can better protect user information security and application stability.
全局守卫
路由守卫
组件内守卫
完整的导航解析流程
beforeRouteLeave
守卫。beforeEach
守卫。beforeRouteUpdate
守卫(2.2+)。beforeEnter
。beforeRouteEnter
。beforeResolve
守卫(2.5+)。afterEach
钩子。beforeRouteEnter
守卫中传给next
的回调函数,创建好的组件实例会作为回调函数的参数传入。