Skip to the content.
Language: English 中文简体

GitHub stars GitHub forks GitHub issues

如果产生其他依赖无法编译的问题,可以尝试将pubspec.yaml中的dependencies中的所有依赖的”^”去掉,重新编译尝试。 还是出错的话在项目主目录执行flutter clean再重新运行。 如果出现插件版本不适配记得看pubspec.yaml文件介绍的插件flutter版本是否与自己本地Flutter适配。

nav_router

flutter最简单/轻量/便捷的路由管理方案,支持各种路由动画,跳转/传参起来非常方便,跳转新页面只需:routePush(NewPage());

Log

开始使用

添加依赖

dependencies:
  nav_router: any #具体版本自定义(any表示最新)

相关文章更新中..

然后使用flutter packages upgrade来更新flutter的插件包

示例项目

example文件夹中有一个非常漂亮的示例项目。看看这个。否则,请继续阅读以启动并运行。

配置

参数传递

方式1:

正常push新页面,但是在后面加上Then,后面的v就是我们跳转之后的页面带回来的数据,然后我们给它打印出来。

routePush(NewPage()).then((v) {
  print('I received::$v');
});

那么我们新页面就要pop返回值了,直接在pop然后括号里加上我们的参数,可以是任何类型的参数值,之后上面写的东西就能接收到我们这次返回并带过去的参数了。

FlatButton(
  onPressed: () {
    pop('This is the parameter');
  },
  child: Text('Return with parameters'),
),

方式2:

方式二可以用我们的NavData,先在我们要push到的页面添加NavData类型的参数接收,

class NewPage extends StatlessWidget {
  final NavData navData;

  NewPage({this.navData});
}

然后下面就判断这个navData是否为空,也就是上级是否有接收这个方法,如果有的话就带参数返回。

FlatButton(
  onPressed: () {
    if(navData == null) return;
    widget.navData('NavData mode parameter transmission');
    pop();
  },
  child: Text('Return with parameters'),
),

那么我们push的那个地方就可以用navData来接收值并且打印出来了。

routePush(NewPage(navData: (v) {
    print('I received::$v');
  }),
);

效果图 图片不能显示点我

|1.gif| 2.gif | 3.gif| | — | — | — | |4.gif| 5.gif | 6.gif| |7.gif| 8.gif | 9.gif| |10.gif| 11.gif | 12.gif|

Flutter微信群

上图无法显示点我

Flutter教程网:www.flutterj.com

Flutter交流QQ群:874592746

公众号

关注公众号“Flutter前线”,各种Flutter项目实战经验技巧,干活知识,Flutter面试题答案,等你来领取。

贡献者

LICENSE

fluttercandies/nav_router is licensed under the
Apache License 2.0

A permissive license whose main conditions require preservation of copyright and license notices. 
Contributors provide an express grant of patent rights. 
Licensed works, modifications, and larger works may be distributed under different terms and without source code.