美文网首页
Flutter 学习: Flutter中路由替换,返回跟路由

Flutter 学习: Flutter中路由替换,返回跟路由

作者: __素颜__ | 来源:发表于2020-04-21 11:23 被阅读0次
一.复习上一节

命名路由传参步骤

1、写命名路由监听
onGenerateRoute

2、配置路由
final routes = { "/search": (context) =>SearchPage1()}

3、接受页面定义参数
Map arguments;
SearchPage1({this.arguments});

4、路由中添加参数
"/search": (context, {arguments}) => SearchPage1(arguments: arguments)

5、跳转传入参数
Navigator.popAndPushNamed(context, "/search",arguments: {"id":"页面1传入"})

6、接受页面获取参数
Text(arguments != null ? arguments["id"] : "没有内容")

二. Flutter 中路由替换路由
  • 比如我们从用户中心页面跳转到了registerFirst页面,然后从registerFirst页面通过pushReplaceNamed跳转到registerSecond 页面,这个时候当我们点击registerSecond的返回键的时候它会直接返回到用户中心页面
Navigator.of(context).pushReplacementNamed("/search2");
  • 跳转时直接替换当前组件,当返回时就返回到了主页面
三. Flutter 返回到跟路由
  • 比如我们从用户中心跳转到了registerFirst页面,然后从registerFirst页面跳转到了registerSecond页面,然后从registerSecond页面跳转到了registerThrid页面,这个时候我们想的是registerThrid注册成功后返回到用户主页面,这个就可以用到返回跟路由的方法
  • 通过pushReplacementNamed 实现
  Navigator.of(context).pushAndRemoveUntil(
                      new MaterialPageRoute(builder: (context) => MyContent()),
                          (route) => route == null);
  • 注意

1、pushAndRemoveUntil 需要传入两个参数,第一个传入MeatartPageRoute传入你要跳转的页面 ,第二个路由置为空固定写法。
2、返回跟布局也可用通过 pushReplacementNamed 和Navigator.of(context).pop() 实现。因为前面都用了替换路由,直接返回就返回到跟界面了。

四. 总结

1、替换路由
Navigator.of(context).pushReplacementNamed("/search2");

2、返回跟路由
Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (context) => MyContent()),(route) => route == null);

相关文章

网友评论

      本文标题:Flutter 学习: Flutter中路由替换,返回跟路由

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