Flutter 路由传参配置

Flutter 路由传参配置

• 在项目目录routers有一个Routers.dart文件（代码如下）

import 'package:cai_customer/pages/orderDetail/Detail.dart';

final Map<String, Object> routes = {
  '/': (context) => TabContainer.Tab(),
  '/orderDetail': (context, {arguments}) => OrderDetail(arguments: arguments),
};

//固定写法
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;
    }
  }
};

以上就是路由配置得部分，接下来贴出如何使用，例子，列表跳转详情

• 列表传值输入

child: InkWell(
  onTap: () {
    _toggleFavorite();
  },
  child: Text("查看",
      style: TextStyle(
          color: Colors.orange,
          fontSize: 12)),
),

void _toggleFavorite() {
    Navigator.pushNamed(context, '/orderDetail', arguments: data); //data为我们传递参数
  }

• 详情取值

class OrderDetail extends StatefulWidget {
  Map arguments;
  OrderDetail({Key key, this.arguments}) : super(key: key);

  @override
  _OrderDetailState createState() => _OrderDetailState();
}

class _OrderDetailState extends State<OrderDetail> {
  Map data;
  @override
  void initState() {
    data = widget.arguments;  //data就是拿到的传输数据
    // TODO: implement initState
    super.initState();
    getDetail();
  }
}