在Flutter中搜索后如何导航到详细信息页面

Question

我正在学习Flutter，并且试图继续从事这个家伙项目https://github.com/rajayogan/flutterfirestore-instantsearch/blob/master/lib/main.dart（完整代码），但是他没有onTap或onPress函数，可以在搜索后导航到每个详细信息页面，所以我我想知道如何实现。

该项目是关于从Firebase查询数据并在Flutter应用上显示

。

任何人都可以快速浏览一下他的代码，并帮助我如何创建可以导航到每个详细信息页面的Tap功能吗？谢谢

当前应用程序如下所示

我的Firebase数据库中有此字段，

这是他的YouTube视频教程https://www.youtube.com/watch?v=0szEJiCUtMM&t=198s

Answer 1

小部件buildResultCard具有来自搜索结果的数据，因此您只需将其包装在Gesture Detector或Inkwell小部件中，然后将其导航到所需的任何页面即可。这是我将数据转发到MyPage的示例。

Widget buildResultCard(data) {
  return GestureDetector(
    onTap: (){
       Navigator.of(context).push(
          MaterialPageRoute(builder: (context) => MyPage(data: data));
      );
    },
    child: Card(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
        elevation: 2.0,
        child: Container(
            child: Center(
                child: Text(data['businessName'],
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 20.0,
                  ),
                )
            )
        )
    ),
  );
}