如何遍历集合中的所有文档以在ListView中显示内容?

时间:2020-07-19 09:15:07

标签: flutter dart google-cloud-firestore

我的目标 我想遍历一个包含1…n个文档的集合。我想将文档的内容放在ListView中。该集合表示ListView,每个文档应为一个ListTile。

我的Firestore数据 我有一个Firestore数据库,其中包含一个名为“ current_question”的集合,其中包含多个文档。每个文档都包含有关一个问题的详细信息:标题,描述,日期等。

到目前为止我的表现 我知道如何显示一个文档的数据。我不知道的是如何加载所有文档并发布它们。

用于加载一个文档的代码:

body: FutureBuilder(
          future: connectToFirebase(),
          builder: (BuildContext context, AsyncSnapshot<void> snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting) {
              return Center(child: CircularProgressIndicator());
            } else {
              return StreamBuilder<DocumentSnapshot>(
                stream: database.getQuestions(),
                builder: (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot) {
                  if (!snapshot.hasData) {
                    return Center(child: CircularProgressIndicator());
                  } else {
                    Map<String, dynamic> items = snapshot.data.data;
                    print(items);
                    return ListView.builder(
                        itemCount: 1,
                        itemBuilder: (context, i) {
                          return ListTile(
                            title: Text(items['Titel'].toString()),
                            trailing: Text(items['Zaehler'].toString()),
                          );
                        }
                    );
                  }
                },
              );
            }
          }),
Future<void> connectToFirebase() async {
    final FirebaseAuth auth = FirebaseAuth.instance;
    AuthResult result = await auth.signInAnonymously();
    user = result.user;

    database = DatabaseService();
  }
final CollectionReference aktFragen = Firestore.instance.collection('aktFragen')/*.orderBy('Zaehler')*/;

  Stream getQuestions() {
    return aktFragen.document('xAGRoZCgiClrpeAPtb5B').snapshots();
  }

在屏幕截图中查看结果: enter image description here

2 个答案:

答案 0 :(得分:1)

如果要检索所有文档,则必须执行 QuerySnapshot 。这是一种实现方法:

// Creating an instance of your model with all the users info 
  List<CustomModelNameHere> _myListSnapshot(QuerySnapshot snapshot) {
    return snapshot.documents.map((doc) {
      return CustomModelNameHere(
        title: doc.data["title"] ?? "",
        description: doc.data["description"] ?? "",
      );
    }).toList();
  }

 // Get the stream
  Stream<List<CustomModelNameHere>> get getQuestions {
    return aktFragen.snapshots()
      .map(_myListSnapshot);
  }

答案 1 :(得分:0)

@Unbreachable的好答案!

这是我的实现方式:

  @override
  Widget build(BuildContext context) {
    return new StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance.collection('currentQuestions').snapshots(),
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (!snapshot.hasData) {
          return Center(child: CircularProgressIndicator());
        } else {
          return new ListView(
            children: snapshot.data.documents.map((document) {
              return new ListTile(
                title: new Text(document['title'].toString()),
                subtitle: new Text(document['count'].toString())
              );
            }).toList()
          );
        }
      }
    );
  }

我还为该主题找到了很好的youTube教程:

https://www.youtube.com/watch?v=Ak_6_pBBe3U&feature=youtu.be