ion-router-outlet
router outletはAngularの組み込みrouter outletコンポーネントやVueのルーター・ビューコンポーネントと同様の振る舞いをしますが、スタック式のナビゲーションを提供し、ビューをアニメーションで出し入れするためのロジックを含んでいます。
router outlet はナビゲーション用のメソッドを備えていますが、フレームワークのルーターにあるナビゲーションメソッドを使用することをお勧めします。
ライフサイクルHook
Router OutletでRoutesがレンダリングされた時、アニメーションに関連付けられた特定のIonicイベントにアクセスできます。
| Event Name | Description |
|---|---|
ionViewWillEnter | コンポーネントが表示されるアニメーションがはじまる時に発火します。 |
ionViewDidEnter | コンポーネントが表示されるアニメーションが終了した時に発火します。 |
ionViewWillLeave | コンポーネントを離脱するアニメーションがはじまる時に発火します。 |
ionViewDidLeave | コンポーネントを離脱するアニメーションが終了した時に発火します。 |
これらのイベントはIonicのアニメーションシステムと連携し、コンポーネントがアニメーションを完成させたときにアプリの挙動を調整するのに使用できる。これらのイベントはフレームワーク独自のイベントシステムに代わるものではなく、追加されたものです。
Router Guardsを扱うために、以前のionViewCanEnter と ionViewCanLeaveは、フレームワーク特有の同等のものに置き換えられました。AngularにはRouter Guardsがあります。
プロパティ
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 | animation |
| 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) |
イベント
No events available for this component.
メソッド
No public methods available for this component.
CSS Shadow Parts
No CSS shadow parts available for this component.
CSSカスタムプロパティ
No CSS custom properties available for this component.
Slots
No slots available for this component.