ion-router-outlet
ルーターアウトレットは、Angularの組み込みルーターアウトレットコンポーネントやVueのルータービューコンポーネントと同様の動作をしますが、スタックナビゲーションを提供し、ビューの出し入れをアニメーション化するロジックが含まれています。
ルーターアウトレットにはナビゲーションを行うためのメソッドがありますが、フレームワークのルーターでナビゲーションメソッドを使用することをお勧めします。
ライフサイクル フック
ルーターアウトレットでレンダリングされるルートは、アニメーションに接続された特定のIonicイベントにアクセスできます。
| イベント名 | トリガー |
|---|---|
ionViewWillEnter | ルーティング先のコンポーネントがアニメーションで表示される直前に発生します。 |
ionViewDidEnter | ルーティング先のコンポーネントのアニメーションが完了したときに発生します。 |
ionViewWillLeave | ルーティング元のコンポーネントがアニメーションを開始する直前に発生します。 |
ionViewDidLeave | ルーティング先のコンポーネントのアニメーションが完了したときに発生します。 |
これらのイベントはIonicのアニメーションシステムと連携しており、コンポーネントのアニメーションが完了したときにアプリの一部を連携させるために使用できます。これらのイベントは、フレームワーク独自のイベントシステムの代替ではなく、追加です。
ルーターガードの処理については、以前のionViewCanEnterとionViewCanLeaveは、フレームワーク固有の同等のものに置き換えられました。Angularの場合、ルーターガードがあります。
プロパティ
animated
| 説明 | trueの場合、ルーターアウトレットはコンポーネントのトランジションをアニメーション化する必要があります。 |
| 属性 | animated |
| タイプ | boolean |
| デフォルト | true |
animation
| 説明 | このプロパティを使用すると、AnimationBuilder関数を使用してカスタムトランジションを作成できます。 |
| 属性 | undefined |
| タイプ | ((baseEl: any, opts?: any) => Animation) ｜ undefined |
| デフォルト | undefined |
mode
| 説明 | modeは、使用するプラットフォームスタイルを決定します。 |
| 属性 | mode |
| タイプ | "ios" ｜ "md" |
| デフォルト | getIonMode(this) |
イベント
このコンポーネントで利用できるイベントはありません。
メソッド
このコンポーネントで利用できるパブリックメソッドはありません。
CSSシャドウパーツ
このコンポーネントで利用できるCSSシャドウパーツはありません。
CSSカスタムプロパティ
このコンポーネントで利用できるCSSカスタムプロパティはありません。
スロット
このコンポーネントで利用できるスロットはありません。