Flutter路由管理和接收页面的返回值

Flutter使用Navigator进行路由管理。

跳转页面

使用Navigator的push方法进行跳转。可以看到总共有6个push方法
在这里插入图片描述

1、push(route) 通过路由跳转

通过路由进行跳转

          Navigator.of(context).push(MaterialPageRoute(builder: (context){
            return MyApp();
          }));

也可以直接使用Navigator.push(context, route)进行跳转，直接push的方法里面还用调用的 Navigator.of(context).push(route)。如下图
在这里插入图片描述

2、pushNamed(routeName) 通过路由名称跳转

调用该方法前需要先到MaterialApp下注册路由表，然后给路由命名

注册路由表

      routes: {
        "my_app" : (context) => MyApp(),
        //其它路由
      },

routes是一个Map集合，key就是路由名
在这里插入图片描述
通过路由名跳转：

Navigator.of(context).pushNamed("my_app");

3、pushAndRemoveUntil()和pushNamedAndRemoveUntil()

还是通过路由和路由名跳转的，和上面两个区别是使用此方法跳转的路由会处于栈顶，并把之前的路由清除掉。类似于Android
singleTask启动模式。

        Navigator.of(context).pushAndRemoveUntil(
              MaterialPageRoute(builder: (context)=>MyApp()),
                  (route)=>route == null);

使用此方法跳转到新页面，在按返回键则会直接退出程序。

 Navigator.of(context).pushNamedAndRemoveUntil("my_app",
                  (route)=>route == null);

4、pushReplacement()和pushReplacementNamed()

路由替换，第二个参数result是个可选参数，如果不传就替换成newRoute，如果传则替换成result。

    Navigator.of(context).pushReplacement(MaterialPageRoute(builder: (context)=>MainPage())});
    Navigator.of(context).pushReplacementNamed("my_app");

pop()出栈，关闭页面

关闭当前页面

 Navigator.of(context).pop();

接收上个页面的返回值

在这里插入图片描述
所有的push方法都会有个Future回调。我们可以在Future中接收返回值。

          Future future = Navigator.of(context).pushNamed("my_app");
          future.then((value){
            
          });

future的回调方法中会收到一个value值。

pop([ T result ]) pop有个可选参数result，关闭页面的时候传递一个result给上个界面

Navigator.of(context).pop("test");

上个页面的future就会收到值为test的回调

正义啊

发布了82 篇原创文章 · 获赞 16 · 访问量 3万+

私信关注