美文网首页
Flutter中路由传值方式

Flutter中路由传值方式

作者: xieyinghao | 来源:发表于2023-06-03 00:01 被阅读0次

    Flutter开发过程中,使用路由的步骤如下:首先注册下一个路由列表。然后设置一个初始的路由(initialRoute)。代码如下:


    image.png

    一、路由跳转

    1.不需要传值的时传值

    参考foutr的注册方式

     "/four":(context)=>const FourPage()
    

    2.路由跳转传值
    1.构建路由初始化的时候直接传值

    可以参考下FourPage的路由注册方式

            "/third":(context)=>const ThirdPage(content: '你好',),
    

    这种方式不太灵活,因为大多数的开发场景中,我们是在跳转之前知道要传给下一个页面的值的。

    这个时候,我们可以通过设置实体类的方式来传值

    2.构建实体类传值

    我们可以看一下pushNamed的类。其中argument是用来传递参数的,我们可以构建一个class类传值,这样的方式会比较灵活。

    \@optionalTypeArgs
    static Future<T?> pushNamed<T extends Object?>(
      BuildContext context,
      String routeName, {
      Object? arguments,
    }) {
      return Navigator.of(context).pushNamed<T>(routeName, arguments: arguments);
    }
    

    我们可以先声明一个Todo类,传一个title给下一个页面。

    class Todo{
      String title;
      Todo(this.title);
    }
    

    按钮的点击事件如下:

    Navigator.pushNamed(context, "/four",arguments: Todo("content"));rran
    

    然后我们使用ModalRoute.of(context)!.settings.arguments方法来解析传递的参数。代码如下:

    final Todo arguments = ModalRoute.of(context)!.settings.arguments as Todo;
    print('接收第二个页面传过来的值:${arguments.title}');

    来源:https://blog.csdn.net/ZCC361571217/article/details/127174639

    相关文章

      网友评论

          本文标题:Flutter中路由传值方式

          本文链接:https://www.haomeiwen.com/subject/wkemedtx.html