ion-router-outlet
路由出口(Router outlet)的行为类似于 Angular 内置的路由出口组件和 Vue 的路由视图组件,但包含了提供堆叠导航和为视图添加进出动画的逻辑。
虽然路由出口有用于导航的方法,但建议使用框架路由器的导航方法。
生命周期钩子
在路由出口中渲染的路由可以访问特定的 Ionic 事件,这些事件与动画相连接
| 事件名称 | 触发条件 |
|---|---|
ionViewWillEnter | 当路由到的组件即将动画进入视图时触发。 |
ionViewDidEnter | 当路由到的组件完成动画时触发。 |
ionViewWillLeave | 当路由来源组件即将开始动画时触发。 |
ionViewDidLeave | 当路由到的组件完成动画时触发。 |
这些事件与 Ionic 的动画系统相关联,可用于在组件完成动画时协调应用的各个部分。这些事件不是你框架自身事件系统的替代品,而是补充。
对于处理路由守卫,旧的 ionViewCanEnter 和 ionViewCanLeave 已被框架特定的等效机制取代。对于 Angular,有路由守卫。
属性
animated
| 说明 | If true, the router-outlet should animate the transition of components. |
| 属性 | animated |
| 类型 | boolean |
| 默认值 | true |
animation
| 说明 | This property allows to create custom transition using AnimationBuilder functions. |
| 属性 | undefined |
| 类型 | ((baseEl: any, opts?: any) => Animation) | undefined |
| 默认值 | undefined |
mode
| 说明 | The mode determines which platform styles to use. |
| 属性 | mode |
| 类型 | "ios" | "md" |
| 默认值 | getIonMode(this) |
事件
该组件没有可用的事件。
方法
该组件没有可用的公共方法。
CSS 阴影部分
该组件没有可用的 CSS 阴影部分。
CSS 自定义属性
该组件没有可用的 CSS 自定义属性。
插槽
该组件没有可用的插槽。