Flutter实现路由传参和参数回传(使用命名路由)

2019-08-15  本文已影响0人  郑永博

第一步配置路由

1 新建routes_mamager.dart文件

//第一步配置路由
final routes = {
  //无参数传递
  '/': (context) => MainContent(),

  //有参数传递,ProductList构造
  //final Map arguments;
  //ProductList({Key key, this.arguments}) : super(key: key) {}
  '/product': (context, {arguments}) => ProductList(arguments: arguments)
};

//固定写法
// ignore: strong_mode_top_level_function_literal_block
var onGenerateRoute = (RouteSettings settings) {
  final String name = settings.name;
  final Function pageContentBuilder = routes[name];
  if (pageContentBuilder != null) {
    if (settings.arguments != null) {
      final Route route = MaterialPageRoute(
          builder: (context) =>
              pageContentBuilder(context, arguments: settings.arguments));
      return route;
    } else {
      final Route route =
          MaterialPageRoute(builder: (context) => pageContentBuilder(context));
      return route;
    }
  }
};

2 在Flutter的入口出初始化路由:

@override
Widget build(BuildContext context) {
  // TODO: implement build
  return MaterialApp(
    initialRoute: '/', //初始化的时候加载的路由
    onGenerateRoute: onGenerateRoute,
  );
}

3 使用
传参有返回值,arguments是传到下一级的参数,then((value))接收上级返回传回的参数

  Navigator.pushNamed(context, '/product', arguments: {'pid': 456})
                .then((value) {//"this is data"
              setState(() {
                name = value;
              });
            });

返回上级界面有返回值

 Navigator.pop(context, "this is data");

无参数返回值

  Navigator.pushNamed(context, '/product');

替换路由

Navigator.pushReplacementNamed(context, '/');

返回根

Navigator.of(context).pushAndRemoveUntil(new MaterialPageRoute(builder: (context)=> new Tabs()), (route)=> route==null );
上一篇下一篇

猜你喜欢

热点阅读