nav_router
nav_router 是 flutter 中最简单/轻量级/便捷的路由管理解决方案。它支持各种路由动画,并且跳转/传递参数非常方便。要跳转到新页面,只需 routePush (NewPage ());
日志
-
2020.07.04-测试 Flutter 1.17.3
-
2020.06.03-取消 pop 默认空字符串数据
-
2020.02.28 – 修复 dev 分支 flutter 错误 pop 方法。
入门
添加依赖
dependencies:
nav_router: any #Specific version customization (any means latest)
相关文章更新…
然后使用 flutter packages upgrade 更新 flutter 插件包
示例项目
example 文件夹中有一个非常棒的示例项目。看看吧。否则,请继续阅读以开始使用。
设置
- 1.在
MaterialApp页面导入我们的插件
import 'package:nav_router/nav_router.dart';
- 2.在
MaterialApp的navigatorKey属性中写入navGK值
Widget build(BuildContext context) {
return new MaterialApp(
title: '',
navigatorKey: navGK,
);
}
- 3.然后,我们就可以开始使用了,这里是跳转页面的示例
Widget buildItem(RouteModel item) {
return new FlatButton(
onPressed: () => routePush(new NewPage()),
child: new Text('Click to jump'),
);
}
- 4.如果想使用其他路由动画进行跳转,可以在后面添加跳转属性,例如:渐变动画
routePush(new NewPage(), RouterType.fade);
参数传递
方法一:
正常推送到新页面,但后面加 Then,后面的 v 是我们跳转后页面返回的数据,然后我们将其打印出来。
routePush(NewPage()).then((v) {
print('I received::$v');
});
然后我们的新页面就会 pop 返回值。直接在 pop 的参数和括号中添加我们的参数。它可以是任何类型的参数值。之后,我们上面写的将接收我们本次返回的参数。
FlatButton(
onPressed: () {
pop('This is the parameter');
},
child: Text('Return with parameters'),
),
方法二:
方法二可以使用我们的 NavData,首先给要跳转到的页面添加 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'),
),
然后我们跳转的地方就可以使用 navData 来接收值并打印出来了。
routePush(NewPage(navData: (v) {
print('I received::$v');
}),
);
效果图
![]() |
![]() |
![]() |
|---|---|---|
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Flutter 微信群
FlutterJ:www.flutterj.com
贡献者
许可
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.










