😇

GoRouter cotext.pop() で前のページに戻れない

2024/07/26に公開

👤対象者

  • go_routerを使っている人
  • popをした時に動作に違和感があって悩んでいる人

以前から問題だった💦

StatefulShellBranchを使用して、BottomNavigationBarを作成して使っているのですが、context.popをすると、トップレベルのパス、HomePage()へ戻ってしまいます💦

「違うんだな前のページへ戻って欲しい」

対応策があった💡

canPop static methodを使うと良いらしい。

与えられたコンテキストを最も強く囲むナビゲータをポップできるかどうか。

初期ルートはナビゲータからポップできないので、この関数はナビゲータをポップしても初期ルートが削除されない場合にのみtrueを返します。

スコープ内にナビゲータがない場合はfalseを返します。

PopEntryのように、外部からポップが妨げられる可能性のあるものは考慮しません。

こちらも参照してください:

canPopがfalseを返すルートに対してtrueを返します。

if (context.mounted) {
        context.pop();
        if (!context.canPop()) {
          // もし前のページがない場合は、特定のルートに戻る
          context.go('/specific-route');
        }

参考にして、Supabaseにデータをupsertしたときに、popする処理を変更すると、前のページにバックしてくれた。どうやら、canPop()を使えば解決できるようだ。

これを使う

if (context.mounted) {
                          context.pop();
                          if (!context.canPop()) {
                            context.goNamed(RouterPath.MY_PAGE);
                          }
                        }

以下のように修正して解決🙌

AppButton(
                    '登録',
                    AppColor.white,
                    () async {
                      try {
                        final user = value.copyWith(
                          user_name: userName.text,
                          birthday: dateText.value ?? '',
                          iconImagePath: iconImagePath.value ?? '',
                          profile: profile.text,
                          job_id: selectedJob.value ?? '',
                        );
                        await Future.wait([
                          ref
                              .read(userRepositoryProvider)
                              .createUserOrUpdate(user),
                          ref
                              .read(firebaseAnalyticsApiProvider)
                              .myPageUpsertEvent(),
                        ]);
                        if (context.mounted) {
                          context.pop();
                          if (!context.canPop()) {
                            context.goNamed(RouterPath.MY_PAGE);
                          }
                        }
                      } on Exception catch (e) {
                        throw Exception(e);
                      }
                    },
                    AppColor.navy,
                    200.w,
                    50.h,
                  ),

まとめ

context.pop()を使用して、バックボタンで戻れるページに戻ろうとしたが戻れない人がいたら、canPop()を試してみてください。

Discussion