如何在Dart中通过onTap函数向其他页面传递参数？路由与站点页面的参数传递及代码复用方案问询

你完全没必要在StopsPage里重复写一遍数据处理逻辑，既然Route页面已经通过getMarshrutWithStops()得到了排序好的站点数据，直接把对应路由的站点列表传递过去就行，步骤很简单：

1. 修改StopsPage的构造函数，接收处理好的站点列表 #

首先把StopsPage原来的stId参数替换成你需要的站点列表，同时移除页面内重复的getMarshrutWithStops()方法——因为数据已经在Route页面处理好了，这里直接用传递过来的数据就行：

class StopsPage extends StatelessWidget {
  // 替换原来的stId，接收排序后的站点列表
  final List<StopList> stops;

  const StopsPage({Key? key, required this.stops}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      // 直接用传递过来的stops构建UI，不需要FutureBuilder了
      body: ListView.builder(
        itemCount: stops.length,
        itemBuilder: (context, index) {
          // 这里可以根据StopList的属性展示具体内容，比如站点名称等
          return ListTile(
            title: Text(stops[index].toString()),
            // 如果需要展示更多信息，比如stId，可以加subtitle
            subtitle: Text('站点ID: ${stops[index].stId}'),
          );
        },
      ),
    );
  }
}

2. 在Route页面的onTap中传递对应路由的站点列表 #

在Route页面的onTap回调里，不要再传递单个stId，而是直接传递当前路由已经处理好的stop列表（也就是routes[index].stop）：

onTap: () {
  Navigator.push(
    context,
    MaterialPageRoute(
      // 传递当前路由对应的排序后站点列表
      builder: (context) => StopsPage(stops: routes[index].stop),
    ),
  );
},

额外优化建议 #

如果你的RouteWithStops模型里还有其他需要在StopsPage展示的路由相关信息（比如路由名称、变体信息），也可以直接传递整个routes[index]对象给StopsPage：

• 把StopsPage的构造参数改成final RouteWithStops routeWithStops
• 在页面里通过routeWithStops.stop获取站点列表，同时还能使用routeWithStops.route、routeWithStops.variant等其他属性

这样做的好处：

• 避免代码冗余：不用在两个页面复制粘贴相同的数据处理逻辑，后续修改逻辑只需要改Route页面的getMarshrutWithStops()即可。
• 减少网络请求：StopsPage不需要再重复调用接口获取数据，既节省用户流量，又能提升页面加载速度。
• 数据一致性：确保StopsPage展示的是和Route页面完全一致的排序后数据，不会出现两边数据不一致的情况。

内容的提问来源于stack exchange，提问作者user16357470