Flutter Streambuilder 映射到 List 对象

Question

我需要在 Flutter 中显示一个列表视图，其中包含来自 firestore 的数据。然后我希望用户能够通过在应用栏的文本字段中键入他的查询来过滤列表视图。这是我为列表视图提出的代码：

_buildAllAds() {

  return StreamBuilder(
    stream: Firestore.instance.collection("Classificados")
    .orderBy('title').snapshots().map((snap) async {
      allAds.clear();
      snap.documents.forEach((d) {
        allAds.add(ClassificadoData(d.documentID,
          d.data["title"], d.data["description"], d.data["price"], d.data["images"] ));
       
      });

    }),
    builder: (context, snapshot) {

      // if (!snapshot.hasData) {
      //  return Center(child: CircularProgressIndicator());
      //  }
      //else{
      //}
      if (snapshot.hasError) {
        print("err:${snapshot.error}");
      }
      
      return ListView.builder(
        itemCount: allAds.length,
        itemBuilder: (context, index) {
          ClassificadoData ad = allAds[index];
          return ClassificadosTile(ad);

        });
    });

}

我将流数据保存在 List allAds of type ClassificadoData （数据项是广告）中的原因是我可以将其复制到另一个 List filteredAds用户可以进行过滤。我需要 allAds 流的原因是我希望用户能够实时看到添加/更新。 所以这段代码“有效”，但感觉有点尴尬，我也不能对构建器做任何事情，因为 snaphot 一直保持为空（例如，在初始数据获取期间无法显示加载器）。 想知道是否有更可靠的方法来做我想做的事情，以及是否有可能将快照的引用传递给构建器。

Answer 1

您似乎混合了使用流和流相关小部件的两种不同概念。理想情况下，您可以使用 StreamBuilder 并直接在 Widget 上使用从流中获取的数据，或者侦听数据并更新一个变量，然后用于填充您的 ListView。我已经从您的代码中构建了后者作为示例：

@override
initState(){
  _listenToData();
  super.initState();
}

_listenToData(){
  Firestore.instance.collection("Classificados")
    .orderBy('title').snapshots().listen((snap){
    allAds.clear();
    setState(() {
      snap.documents.forEach((d) {
        allAds.add(ClassificadoData(d.documentID,
          d.data["title"], d.data["description"], d.data["price"], d.data["images"] ));
      });
    });
  });
}

_buildAllAds() {
  return ListView.builder(
    itemCount: allAds.length,
    itemBuilder: (context, index) {
      ClassificadoData ad = allAds[index];
      return ClassificadosTile(ad);
    }
  );
}