ion-router-outlet
路由出口的行为方式与 Angular 的内置路由出口组件和 Vue 的路由视图组件类似，但包含提供堆叠导航以及动画视图进出的逻辑。
¥The router outlet behaves in a similar way to Angular's built-in router outlet component and Vue's router view component, but contains the logic for providing a stacked navigation, and animating views in and out.
尽管路由出口具有导航方法，但建议使用框架路由中的导航方法。
¥Although router outlet has methods for navigating around, it's recommended to use the navigation methods in your framework's router.
生命周期钩子
¥Life Cycle Hooks
在 Router Outlet 中渲染的路由可以访问连接到动画的特定 Ionic 事件
¥Routes rendered in a Router Outlet have access to specific Ionic events that are wired up to animations
| 活动名称 | 扳机 |
|---|---|
ionViewWillEnter | 当组件路由即将动画进入视图时触发。 |
ionViewDidEnter | 当组件路由完成动画时触发。 |
ionViewWillLeave | 当组件路由即将动画时触发。 |
ionViewDidLeave | 当组件路由完成动画时触发。 |
这些事件与 Ionic 的动画系统相关，并且可用于在组件完成其动画时协调应用的各个部分。这些事件并不是框架自身事件系统的替代品，而是一个补充。
¥These event tie into Ionic's animation system and can be used to coordinate parts of your app when a Components is done with its animation. These events are not a replacement for your framework's own event system, but an addition.
为了处理 Router Guard，旧的 ionViewCanEnter 和 ionViewCanLeave 已被替换为特定于框架的等效项。对于 Angular，有 路由守卫。
¥For handling Router Guards, the older ionViewCanEnter and ionViewCanLeave have been replaced with their framework specific equivalent. For Angular, there are Router Guards.
属性
¥Properties
animated
| Description | If true, the router-outlet should animate the transition of components. |
| Attribute | animated |
| Type | boolean |
| Default | true |
animation
| Description | This property allows to create custom transition using AnimationBuilder functions. |
| Attribute | undefined |
| Type | ((baseEl: any, opts?: any) => Animation) ｜ undefined |
| Default | undefined |
mode
| Description | The mode determines which platform styles to use. |
| Attribute | mode |
| Type | "ios" ｜ "md" |
| Default | getIonMode(this) |
事件
¥Events
No events available for this component.
方法
¥Methods
No public methods available for this component.
CSS 阴影部分
¥CSS Shadow Parts
No CSS shadow parts available for this component.
CSS 自定义属性
¥CSS Custom Properties
No CSS custom properties available for this component.
插槽
¥Slots
No slots available for this component.