Flutter GoRouterのgoとpushの違いを理解する
Flutterでルーティングを扱う際、go_routerパッケージを使うと便利ですが、context.go()とcontext.push()の違いを正確に理解しておくことが重要です。本記事では、これら2つの関数の違いと使い分けについて、例を交えながら説明します。
context.go()とは？
- パスで履歴を書き換える
- 現在の画面を置き換える形で画面遷移が行われる
例：
履歴スタックが以下のようになっているとします：
/notification
/home
この状態で、以下のコードを実行すると：
context.go('/home/details');
履歴は次のように書き換わります：
/home/details
/home
つまり、/notification は履歴から削除され、/home/details に置き換わります。
context.push()とは？
- 履歴を追加する
- 現在の画面の上に、新しい画面が積み重なるように遷移する
例1：/home → /notification
context.push('/notification');
履歴：
/notification
/home
戻るボタンを押せば /home に戻れます。
例2：/notification → /home/details
context.push('/home/details');
履歴：
/home/details
/notification
戻ると /notification に戻ります。
ルート定義と履歴の一貫性
たとえば、以下のような階層的ルート定義があるとします：
-
/home/home/details
この場合、通常は /home → /home/details → 戻ると /home という流れを想定します。
しかし、context.push() を使えば、ルート定義に関係なく履歴を構築できるため、/notification → /home/details → 戻ると /notification という流れを作れます。
まとめ
| 関数 | 挙動 | 履歴の扱い | 用途の推奨 |
|---|---|---|---|
go |
現在の画面を置き換える | 履歴を書き換える | 通常の画面遷移、ルート定義に沿った遷移 |
push |
現在の画面の上に新しい画面を追加する | 履歴を追加する | 戻る先をカスタマイズしたい場合などの特殊なケース |
推奨
- 基本的には、ルート定義に沿って
context.go()を使うことで、画面の階層と履歴が一致し、ユーザーにとって自然な操作感になります - 特別な画面遷移（例：通知画面から詳細画面に直接遷移して、戻ると通知画面に戻るなど）を実現したい場合に
context.push()を使うと便利です