在flutter中合并多个firebase流

如何解决在flutter中合并多个firebase流

伙计，将多个 firebase 流合并到一个流中是一个真正的问题。有人应该就此写一篇文章或简单的视频教程。使用 StreamGroup、FlatMap()、Rx.combineLatest、StreamZip 或 CombineLatestesstream。我从昨天开始就尝试解决这个问题，但我无法得到明确的指导。

class CartPage extends StatefulWidget{
   @override
   _CartPageState createState() => _CartPageState();
}
class _CartPageState extends State<CartPage> {
   
   // a firebase collection for all items
   Stream stream1 = EcommerceApp.firestore
    .collection("items")
    .where("shortInfo",whereIn: EcommerceApp.sharedPreferences
            .getStringList(EcommerceApp.userCartList))
    .snapshots();

   // a firebase collection for flash sales items
   Stream stream2 = EcommerceApp.firestore
    .collection("flashitem")
    .where("shortInfo",whereIn: EcommerceApp.sharedPreferences
            .getStringList(EcommerceApp.userCartList))
    .snapshots();

   List<QuerySnapshot> getList(QuerySnapshot list1) {
   List<QuerySnapshot> result = [];
   (list1 as List).forEach((element) {
     result.add(element);
    });
     return result;
   }

 @override
 Widget build(BuildContext context) {

  Stream combinestream = Rx.combineLatest2(streamA,streamB,(a,b) => [a,b]);


   return Scaffold(
    appBar: MyAppBar(),body:CustomScrollView(
      slivers: [
        SliverToBoxAdapter(
          child: Container(
            height: 10.0,),StreamBulder(
       stream: combinestream,builder: (context,snapshot) {
              if (!snapshot.hasData) {
                return SliverToBoxAdapter(
                  child: Center(
                    child: circularProgressBar(),);
              } else {
              List<QuerySnapshot> _list = [];
                _list.addAll(getList(snapshot.data[0]));
                _list.addAll(getList(snapshot.data[1]));
                if (_list.length == 0) {
                } else {
                  return SliverList(
                    delegate: SliverChildBuilderDelegate(
                      (context,index) {
                        ProductModel model = ProductModel.fromJson(
                           _list[index].docs[index].data());

                        return cartSourceInfo(model,context,removeCartFunction: () =>
                                removeItemFromUserCart(model.shortInfo));
                      },childCount: childCount: snapshot.hasData ? _list.length : 0,);
                }
              }
            }    
       )
    );
 }
}

这里的大部分答案都使用在 rxdart 中废弃的 Observable 库，当我尝试使用相同的语法来解决使用 Rx.latestCombine2 时，没有数据流。当我尝试将 list 类型的 querySnapshot 传递给流 Stream 时，我收到了一批错误：

“List”类没有实例获取器“docs”。 接收器：“_GrowableList”的实例（长度：2） 尝试调用：文档

请告诉我如何将这两个 firebase 流嵌套到 ome 中，或者如何使用 Rx.combineLatest2 方法来解决这个问题。

解决方法

语法看起来正确，但是当试图访问每个流的数据时，您必须通过索引访问它，因为快照基本上是一个列表

所以要访问流1和流2的快照，应该像这样访问

snapshot.data[0].docs 和 snapshot.data[1].docs 分别。

您可以组合两个流并在 Ui 中显示列表，并确保根据 T 的类型分配适当的类型 snapshot.data[index].docs

 List<QuerySnapshot> combineLists(
      List<QuerySnapshot> list1,List<QuerySnapshot> list2) {
    List<QuerySnapshot> result = [];
    list1.forEach((element) {
      result.add(element);
    });
    list2.forEach((element) {
      result.add(element);
    });
    return result;
  }

StreamBulder(
 ​stream: combineStream,​builder: (context,AsyncSnapshot<List<QuerySnapshot>> snapshot) {
   ​if (!snapshot.hasData) {
      ​return SliverToBoxAdapter(
        ​child: Center(
          ​child: circularProgressBar(),​),​);
      ​} else {​
         final List<QuerySnapshot> _list=[];
         final List<QuerySnapshot> combineSnapshot =
                    combineLists(snapshot.data[0],snapshot.data[1]);
         ​if (_list.length == 0) {
            ​return addItems();
         ​} else {
             return SliverList(
                ​delegate: SliverChildBuilderDelegate(
                (context,index) {
                     ProductModel model = ProductModel.fromJson(
                     _list[index].data());
                 return cartSourceInfo(model,context,removeCartFunction: 
                    () => removeItemFromUserCart(model.shortInfo));
                 ​},childCount:_list.length,),);
           ​}
        }
   }