ion-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 Shadow Parts
该组件没有可用的 CSS 阴影部分。
CSS 自定义属性
该组件没有可用的 CSS 自定义属性。