Flutter路由跳转详解

川长思鸟来 2024-04-20 08:42 146阅读 0赞

flutter中跳转一直记了忘,忘了记,在这里记录下吧:

和安卓中的intent类似,跳转新页面需要当前上下文以及需要跳转的页面。如果有数据需要传输也可,参数通过跳转页面的构造方法传递。

1、不带参数直接跳转

  1. ///不带参数的路由表跳转
  2. Navigator.pushNamed(context, routeName);

2、带参数直接跳转

  1. ///带参数的路由表跳转 ,one、two为参数。需要在对应页面写好对应构造方法
  2. Navigator.pushNamed(context, routeName(one,two));

这两种页面跳转我理解为普通跳转,即按返回键可以返回(类似于安卓中的入栈)。下面的都可以利用构造方法为跳转的新页面进行传递参数,为了简洁(实际上是因为懒)就不重复写了。

3、跳转新页面并且替换,比如登录页跳转主页

  1. ///跳转新页面并且替换
  2. Navigator.pushReplacementNamed(context, routeName);

4、跳转到新的路由,并且关闭给定路由的之前的所有页面。可用于退出登录返回到登录页面

  1. ///跳转到新的路由,并且关闭给定路由的之前的所有页面
  2. Navigator.pushNamedAndRemoveUntil(context, '/calendar', ModalRoute.withName('/'));

5、带参数的路由跳转,并且监听返回

  1. ///带参数的路由跳转,并且监听返回
  2. Navigator.push(context, new MaterialPageRoute(builder: (context) => new NotifyPage())).then((res) {
  3. ///获取返回处理
  4. });

Navigator 的 push 返回的是一个 Future,这个Future 的作用是在页面返回时被调用的。也就是你可以通过 Navigatorpop 时返回参数,之后在 Future 中可以的监听中处理页面的返回结果。处理方法如下:

  1. @optionalTypeArgs
  2. static Future<T> push<T extends Object>(BuildContext context, Route<T> route) {
  3. return Navigator.of(context).push(route);
  4. }

好了,先这样。

发表评论

表情:
评论列表 (有 0 条评论,146人围观)

还没有评论,来说两句吧...

相关阅读

    相关 Flutter详解

    lutter中跳转一直记了忘,忘了记,在这里记录下吧: 和安卓中的intent类似,跳转新页面需要当前上下文以及需要跳转的页面。如果有数据需要传输也可,参数通过跳转页面...

    相关 【Vue】

    路由跳转有几种方式,我用的最多的是$router.push的方法: 实践: 例如下面的页面,要求点详情跳转到详情页。 ![在这里插入图片描述][watermark_