我需要在 Flutter 中显示带有来自 firestore 的数据的 ListView 。然后我希望用户能够通过在应用程序栏中的文本字段中输入查询来过滤 ListView 。这是我为 ListView 想出的代码:
_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);
});
});
}
我将流数据保存在 ClassificadoData 类型的列表 allAds 中(数据项是广告)的原因是因为我可以将其复制到另一个列表 filteredAds 中用户可以进行过滤。我需要 allAds 流的原因是我希望用户能够实时看到添加/更新。 因此,这段代码“有效”,但感觉有点尴尬,而且我也无法对构建器执行任何操作,因为快照始终保持为空(例如,在初始数据获取期间无法显示加载程序)。 想知道是否有一种更可靠的方法来完成我想要的事情,以及是否可以向构建器提供对快照的引用。
最佳答案
您似乎混合了使用 Stream 和 Stream 相关小部件的两种不同概念。理想情况下,您可以使用 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);
}
);
}
关于Flutter Streambuilder 映射到 List 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59574238/