Flutter Firebase 使用合并最新流合并流列表并在 StreamBuilder 上显示

Question

我有一个这样的流的组合列表；

var Ref1 = _firestore
      .collectionGroup("Posts")
      .where('postID', whereIn: List1)
      .snapshots();
  var Ref2 = _firestore
      .collectionGroup("Posts")
      .where('postID', whereIn: List2)
      .snapshots();
  var Ref3 = _firestore
      .collectionGroup("Posts")
      .where('postID', whereIn: List3)
      .snapshots();
  
  List<Stream<QuerySnapshot>> combineList = [Ref1, Ref2, Ref3];

combineList通过这种方法，我合并了来自;的流。

var totalRef = Rx.combineLatest(
    combineList, (list) => (list as Iterable<Iterable>).flattened);

然后我用totalRef里面的StreamBuilder。

StreamBuilder<QuerySnapshot>(
                      stream: totalRef,
                      builder:
                          (BuildContext context, AsyncSnapshot asyncsnapshot) {
                        if (asyncsnapshot.hasError) {
                          return Center(
                            child: Text("Error"),
                          );
                        } else {
                          if (asyncsnapshot.hasData) {
                            List<DocumentSnapshot> listOfDocumentSnapshot =
                                asyncsnapshot.data.docs;
                            return ListView.builder(
                              physics: ScrollPhysics(),
                              shrinkWrap: true,
                              itemCount: listOfDocumentSnapshot.length,
                              itemBuilder: (BuildContext context, int index) {
                                return Padding(
                                  padding: const EdgeInsets.symmetric(
                                      horizontal: 12.0, vertical: 12.0),
                                  child: Container(
                                    child: Column(
                                      children: <Widget>[
                                        Stack(
                                          children: <Widget>[
                                            Align(
                                              alignment: Alignment.topCenter,
                                              child: ClipRRect(
                                                borderRadius:
                                                BorderRadius.circular(24),
                                                child: GestureDetector(
                                                  onTap: () => navigateToDetail(
                                                      listOfDocumentSnapshot[
                                                      index]),
                                                  child: Image(
                                                    height: 320,
                                                    width: 320,
                                                    fit: BoxFit.cover,
                                                    image: NetworkImage(
                                                        listOfDocumentSnapshot[
                                                        index]["photo"]),
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                );
                              },
                            );
                          }
                           else {
                            return Center(
                              child: CircularProgressIndicator(
                                color: Colors.orangeAccent[400],
                              ),
                            );
                          }
                        }
                      },
                    ),

我还列出了 StreamBuilder 中的快照数据；

List<QuerySnapshot> querySnapshot =
                                asyncsnapshot.data.toList();

                            List<DocumentSnapshot> listOfDocumentSnapshot = [];

                            querySnapshot.forEach((query) {
                              listOfDocumentSnapshot.addAll(query.docs);
                            });

当我在 StreamBuilder 中使用totalRef时，我遇到了这样的错误；

type 'CombineLatestStream<QuerySnapshot<Object>, Iterable<dynamic>>' is not a subtype of type 'Stream<QuerySnapshot<Object?>>?

我的问题很清楚，但简单总结一下，我有一个名为combineList的流列表，该列表中的流数量完全取决于用户，因此流数量因用户而异，我需要组合这个combineList并将其打印为 StreamBuilder 中的单个流。目前我发现的最好的方法是CombineLatestStream 方法，但是我在StreamBuilder 中调用它时遇到了我提到的错误。

我已经处理这个问题好几天了。一旦我收到错误，whereIN 查询仅限于 10 个值。当我了解到这一点时，我了解到我必须单独查询流，然后合并它们。我分别查询了流，然后将它们与 StreamGroup.merge 和 Rx.merge 方法合并，然后将它们与 StreamGroup.merge 和 Rx.merge 方法合并。我收到错误。收到错误后，我了解到我需要使用 mergeLatest 方法合并流，现在我收到此错误。

请知道答案或以前遇到过这个问题的人，为我的代码编写适当的解决方案，有关代码的所有信息已经在上面，如果您想让我提供更多信息，我可以编辑问题。

Answer 1

经过一番努力，我解决了我的问题。我的回答给那些有同样问题的人。

首先，我意识到我错误地组合了名为combineList的流列表，所以我改变了我的合并方法，如下所示：

var totalRef = CombineLatestStream.list(combineList);

然后我改变了StreamBuilder的设计：

StreamBuilder<List<QuerySnapshot>>(
                      stream: totalRef,
                      builder: (BuildContext context,
                          AsyncSnapshot<List<QuerySnapshot>> snapshotList) {} )

因此，我将 StreamBuilder 从查询快照转换为来自查询快照列表的 StreamBuilder。

然后，在构建器中；为了访问快照列表中的数据，我将此快照转换为数据类型并将其定义在 listOfDocumentSnapshot 列表中。

List<QuerySnapshot> querySnapshot =
                                snapshotList.data;

                            List<DocumentSnapshot> listOfDocumentSnapshot = [];

                            querySnapshot.forEach((query) {
                              listOfDocumentSnapshot.addAll(query.docs);
                            });

ListView.builder中的itemCount自然就变成了这样：listOfDocumentSnapshot.length,

然后我就可以通过 ListView.builder 中的索引号调用每个数据。