0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Flutter】go_routerを使用した、画面に戻ってきた時の判定

Posted at

問題

go_routerを使用していて、
遷移した先の画面から遷移元画面に戻ってきた時に処理を追加したかったが、
initStateなどで検知できなく、戻ってきたことを判定できなかった

対応

GoRouterDelegateにlistenerを追加して、監視を行うことで戻ってきたかを判定

controller.dart

@override
  Widget build(BuildContext context, WidgetRef ref) {
    final router = ref.read(goRouterProvider); // GoRouterを取得

    // 監視対象が変わった時の処理を記載
    void listener() {
      // UI描画後
      WidgetsBinding.instance.addPostFrameCallback((_) {
        // Config(RouteMatchList)を取得
        final config = router.routerDelegate.currentConfiguration;
        
        // 変更後のfullPathを取得
        final fullPath = config.fullPath

        /* 
        fullpath以外もあるので要確認
        config.last.matchedLocation;
        config.pathParameters;
        config.uri.queryParameters;
        */

        // 取得した情報を元に処理を記載
        if(fullPath == 'URL') {
            // API呼び出しや再描画などを呼び出し
        }

      });
    }
    
    useEffect(() {
      // リスナーに追加
      router.routerDelegate.addListener(listener);
      return () {
        // disposeでリスナーから削除
        router.routerDelegate.removeListener(listener);
      };
    }, []);
  }

改善案

今回はGoRouterをprovider管理していたのでWidgetRefで取得してきたが、
MaterialApp.routerで監視設定してURLを取得しProviderで管理すれば
他画面での実装が必要な時にそのProviderをwatchするだけでよさそう

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?