14
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Flutter Webでクエリパラメータやパスパラメータを使う方法

Last updated at Posted at 2019-05-22

クエリパラメータやパスパラメータはonGenerateRouteを使えば取得可能な模様

雑ですが、下記のような形で実装すればFlutter Webでもクエリパラメータは取得できます。
settingsにパスが入るので、それをクエリパラメータの部分と純粋なパス部分に分割して処理すればいけます。
RouteSettingsを使用すれば、URLもそれに応じて変わるようなので、URL共有して同じページが見れるようになります。
パスパラメータも同様の方法で可能だと思います。

return MaterialApp(
      onGenerateRoute: (settings) {
        var paths = settings.name.split('?');
        var path = paths[0];
        var queryParameters = Uri.splitQueryString(paths[1]);

        if (path == PassArgumentsScreen.routeName) {
          return MaterialPageRoute(
            settings: RouteSettings(name: settings.name), // これによりURLが変わる
            builder: (context) {
              return PassArgumentsScreen(
                title: queryParameters['title'],
                message: queryParameters['message'],
              );
            },
          );
        }
      },
      title: 'Navigation with Arguments',
      home: HomeScreen(),
);

Flutter WebでWeb固有のものはどうなっていくんだろう?🤔

14
4
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
14
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?