如何在 Flutter 中嵌套 StreamBuilder?

2023-12-08

我有 2 个流,需要组合起来构建一个小部件,但与我见过的其他问题不同,我需要嵌套流。

我有一个从 Firestore 获取文档集合的流,以及一个依赖于第一个文档的数据来获取文档子集合的流。我想将它们组合成一个流,但它们需要嵌套,因为每个文档都有自己的文档子集合。

流 1(从 FireStore 获取习惯集合):

Stream<List> getHabits(){
  final Stream<QuerySnapshot> documents = Firestore.instance
    .collection("users")
    .document('VtL1sxOoCOdJaOTT87IbMRwBe282')
    .collection("habits")
    .snapshots();

  Stream<List> data = documents.map((doc) {
    List data;
    final documents = doc.documents;
    ///Maybe this would work to get history of each doc? 
    for(int i = 0; i < documents.length; i++){
      ///not sure what to do
      getHistory(documents[i].documentID, DateTime.utc(2019,7,7), DateTime.now());
    }

    data = documents.map((documentSnapshot) => documentSnapshot).toList();

    return data;
  });

  return data;
}

流 2(在流 1 中调用,采用DocumentID作为参数,获取文档的子集合):

Stream<List> getHistory(String id, DateTime start, DateTime end) async* {
  await for (QuerySnapshot querySnapshot in Firestore.instance
    .collection("users")
    .document('VtL1sxOoCOdJaOTT87IbMRwBe282')
    .collection("habits")
    .document(id)
    .collection("history")
    .where('day', isGreaterThanOrEqualTo: start)
    .where('day', isLessThanOrEqualTo: end)
    .snapshots()) {

      List history;
      final documents = querySnapshot.documents;

      history = documents.map((documentSnapshot) => documentSnapshot).toList();

      yield history;
    }
}

有关如何将这些流以嵌套格式组合到一个流中以供使用的任何帮助StreamBuilder在颤振中将不胜感激!

EDIT我不确定我是否朝着正确的方向工作,但我尝试实施 spenster 的解决方案,这就是除了上述功能之外我目前拥有的解决方案。

StreamBuilder<List>(
  stream: getHabits(),
  initialData: [],
  builder: (context, snapshot) {
    List<UserHabit> habits = [];
    List<Widget> test = List.generate(snapshot.data.length, (index){
      List<History> history = [];
      DocumentSnapshot doc = snapshot.data[index];
      return StreamBuilder(
        stream: getHistory(doc.documentID, DateTime.utc(2019,7,7), DateTime.now()),
        builder: (context, snapshot) {
          if (snapshot.hasError)
            return new Text('Error: ${snapshot.error}');
          switch (snapshot.connectionState) {
            case ConnectionState.waiting: return new Text('Loading...');
            default:
              if(!snapshot.data.isEmpty){ //history collection exists
                for(int i = 0; i < snapshot.data.length; i++){
                  //add to history
                  history.add(History(
                    day: snapshot.data[i]['day'].toDate(), 
                    dateCompleted: snapshot.data[i]['dateCompleted'].toDate(), 
                    morning: snapshot.data[i]['morning'],
                    afternoon: snapshot.data[i]['afternoon'],
                    evening: snapshot.data[i]['evening'],
                    anytime: snapshot.data[i]['anytime'],
                  ));
                }
              }
              habits.add(UserHabit(
                name: doc['habit'],
                color: doc['color'],
                icon: doc['icon'],
                repeat: doc['repeat'],
                daily: doc['daily'],
                weekly: doc['weekly'],
                monthly: doc['monthly'],
                time: doc['time'],
                history: history,
              ));
              print(habits); //returns each iteration of assembling the list
              return Text("i dont want to return anything");
          }
        },
      );
      }
    );
    print(habits); //returns empty list before anything is added
    return Column(
      children: test,
    );

  },
),

UserHabits 和 History 的类可以共享,但它们只是分配类型并允许轻松访问的基本类。


我简单地使用嵌套做了类似的事情StreamBuilders。取决于你想要怎样Widgets 组织起来,您可以在外部创建流StreamBuilder。根据您的澄清评论,这是一种可能性:

@override
Widget build(BuildContext context) {

  var habits = Firestore.instance
    .collection("users")
    .document('VtL1sxOoCOdJaOTT87IbMRwBe282')
    .collection("habits")
    .snapshots();

  return StreamBuilder<QuerySnapshot>(
    stream: habits,
    builder: (context, snapshot) {

      if (!snapshot.hasData)
        return Text("Loading habits...");

      return ListView(children: snapshot.data.documents.map((document) {

        var query = Firestore.instance
          .collection("users")
          .document('VtL1sxOoCOdJaOTT87IbMRwBe282')
          .collection("habits")
          .document(document.documentID)
          .collection("history")
          .where('day', isGreaterThanOrEqualTo: start)
          .where('day', isLessThanOrEqualTo: end)
          .snapshots();

        return StreamBuilder<QuerySnapshot>(
          stream: query,
          builder: (context, snapshot) {

            if (!snapshot.hasData) return Text("Loading...");

            // right here is where you need to put the widget that you
            // want to create for the history entries in snapshot.data...
            return Container();
          },
        );
      }).toList());
    },
  );
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 Flutter 中嵌套 StreamBuilder? 的相关文章

  • 如何为发布而不是调试创建密钥库?扑

    我按照使用此网站部署 flutter 的步骤进行操作https flutter io android release https flutter io android release 当我运行 flutter build apk 时出现此错
  • 如何在 Flutter App 中按时间注销?

    如果用户在登录后对应用程序没有反应或不活动超过 5 分钟 我需要从应用程序中注销用户 该应用程序将转到主登录页面 我尝试实施给定的解决方案here https stackoverflow com questions 52602606 how
  • Flutter:构造函数中 List 参数的默认分配

    在定义构造函数时 是否可以将常量值分配给数据类型 List 的可选参数 例如 class sample final int x final List
  • 如何在颤动中从图像选择器中裁剪图像?

    我想允许用户裁剪他从图像选择器中选择的图像并保存它 类似于在 Whatsapp 上上传个人资料图片 我怎样才能在颤振中做到这一点 示例图片 您可以使用这2个flutter库来实现这一点 图像选择器 图像裁剪器 图像选择器使用iOS和Andr
  • Flutter 使用 RichText 填空

    我几乎完成了我的应用程序的填空实现 但不幸的是我不断遇到布局问题 然而 当我不断解决问题时 我几乎已经完成了 这是到目前为止的代码 RichText text TextSpan text dummy style TextStyle colo
  • Flutter Web 平台检查

    我正在尝试找到一种方法来查看我的 flutter web 项目正在哪个平台 iOS 或 Android 上运行 当我使用if Platform isIOS do something 我面临以下错误 Error Unsupported ope
  • 空安全 AppLocalization 字符串的最佳方法

    Question 我在用AppLocalizations of context myString在我的 null safe flutter 应用程序中国际化字符串 我的 IDE 告诉我AppLocalizations of context
  • Dart - 何时在集合上使用 Collection-For-In 与 .Map()

    collection for in 操作和 map 方法都可以返回对先前集合中的元素的一些操作 是否有任何理由更喜欢使用其中一种而不是另一种 var myList 1 2 3 var alteredList1 for int i in my
  • 颤动:所选值不显示在下拉列表中

    我正在从 SQLite 数据库填充城市名称并尝试显示为下拉列表 我通过遵循教程使其工作 但遇到了一个小问题 所选值不会显示在下拉列表中 它继续显示默认提示值 但是 我能够分配和检索正确的选定值 这是我的代码 cities dart clas
  • 将 SQL Server 与 Dart 结合使用

    我还没有找到很好的答案 所以我想尝试一下得到答案 将 Microsoft SQL Server 与 Dart 结合使用的最佳方式是什么 我需要它能够从基本上任何操作系统 网络和移动设备上使用它 我觉得最好的方法可能是 GraphQL 但我对
  • Android Studio 无法运行 Xcode 模拟器

    我正在尝试使用 Xcode iPhone 模拟器模拟我的 Flutter 应用程序 但收到此错误 在升级 Android Studio 和 Xcode 之前 它运行良好 Launching lib main dart on iPhone X
  • 使用 EditableText 进行 Flutter

    我正在尝试弄清楚如何在 Flutter 中使用 TextEditor 我有 卡片编辑器 基本上我希望能够处理相当于一段文本的内容 new EditableText autofocus true maxLines null backgroun
  • 缓存 firestore 中 get 的第一个实现

    我希望 firestore 每次都先从缓存中获取数据 根据 Firestore 文档 传递 缓存 或 服务器 选项必须启用相同的功能 下面的例子 db collection cities where capital true get cac
  • Flutter - 选择 TextFormField 时键盘不显示

    我目前遇到一个问题 当我选择任何一个时 键盘不会出现TextFormFielda 内的小部件Form小部件 这是表单的代码 位于我的内部CreateAccountForm有状态的小部件 import package flutter mate
  • 不使用 BuildContext 预加载图像

    有没有办法在函数中加载 Flutter 中的图像而无需访问 BuildContext Flutter 可以预加载图像precacheImage 需要BuildContext 使用起来不方便 我想加载图像initState StatefulW
  • Flutter:带有嵌套导航的底部导航栏,并在选项卡更改时恢复根页面

    我是 Flutter 开发的新手 我已经阅读了多个教程来了解底部导航栏 我已经尝试过这些教程 但无法达到我的要求 我遵循的教程 https codewithandrea com articles multiple navigators bo
  • 如何设置Firestore安全规则? Resource.data:空值错误

    我需要一些帮助来使我的 Firestore 安全规则发挥作用 这些是我的 Firestore 规则 service cloud firestore match databases database documents match order
  • NoSuchMethodError:尝试调用非函数,例如 null:'dart.global.firebase.auth'

    Flutter 新手 我怀疑在尝试设置 Firebase Auth 时错过了一些非常简单的事情 一直在网上寻找解决方案 大多数人要求您仔细检查 firebase auth js 是否正确包含在 index html 文件中 这样就完成了 下
  • 确保 StreamReader 不会挂起等待数据

    下面的代码读取从 tcp 客户端流读取的所有内容 并且在下一次迭代中它将仅位于 Read 上 我假设正在等待数据 我如何确保它不会在没有任何内容可供读取时返回 我是否必须设置低超时 并在失败时响应异常 或者有更好的办法吗 TcpClient
  • 向上滚动时固定项目

    所以我有以下屏幕 我正在寻找一种方法 使得当用户向上滚动时 包含进度条和这 4 个数据字段 ItemHeader 的小部件将向上滚动 但搜索容器 SearchTextField 将被固定 到顶部 当然 当用户向下滚动时 它应该重新出现 我找

随机推荐

  • 为什么空格会影响相等字符串的同一性比较? [复制]

    这个问题在这里已经有答案了 我注意到 向相同的字符串添加空格会使它们使用时比较不相等is 而非空间版本比较相等 a abc b abc a is b outputs True a abc abc b abc abc a is b outpu
  • 更改 UINavigationItem 颜色

    我需要为 UINavigationBar 按钮设置自定义颜色 我正在做以下事情 RGB func 是一个定义 void viewWillAppear BOOL animated for UIView view in self navigat
  • Windows Phone 7 中的样式触发器

    我想使用 Windows Phone 7 中的样式触发器来根据布尔变量更改图像的源 我想做这样的事情
  • 使用 Javascript 关闭所有弹出窗口

    有谁知道如何在Javascript中关闭所有弹出窗口 由javascript弹出的窗口 Example 单击打开 3 个新窗口 按钮 并使用 window open 来 打开所有 3 个新窗口 单击一个按钮并关闭所有 3 个按钮 一起弹出窗
  • 右值引用和左值引用有什么区别? (代码生成)

    从较低级别的角度来看 r 值参考是什么样的 我似乎无法理解它 我可以查看从右值引用与左值引用生成的代码 等效的 C 或 x86 x64 示例吗 例如 这个构造会是什么样子 我们暂时假设没有复制省略 vector
  • Request.IsAuthenticated 始终返回 false

    我正在努力向我正在构建的站点添加登录功能 但登录后 Request IsAuthenticated 属性始终返回 true 我搜索了这个错误并一遍又一遍地找到相同的答案 但这些解决方案对我不起作用 来自 AccountController
  • Android:在 ConstraintLayout 中保留全宽和未定义高度 ImageView 的比例?

    In a ConstraintLayout an ImageView与其父级绑定的方式如下 它的左侧绑定到屏幕的左侧 它的右侧绑定到屏幕的右侧 它的顶部绑定到小部件的底部 它的底边绑定到屏幕的底边 Thus my ImageView看起来是
  • .Value = .Value 的作用与 VBA 中的 Evaluate() 函数类似吗?

    考虑以下片段 它将相同的公式写入两个单元格A1 and A2 Sub Main With Range A1 Formula 1 1 End With With Range A2 Formula 1 1 Value Value End Wit
  • 日期之间的差异

    我想计算两个时间之间的差异 其中一个是当前时间 另一个是 HH MM 格式 始终是未来时间 如果我只是从 now 中减去 futuretime 它当然应该是一个正数 这工作正常 直到 如果 now 是下午或晚上 而 futuretime 是
  • PHP按位左移32位问题以及大数算术运算的不良结果

    我有以下问题 第一 我试图对一个大数进行 32 位按位左移 并且由于某种原因该数字总是按原样返回 例如 echo 516103988 lt lt 32 echoes 516103988 因为将位向左移动一位相当于乘以 2 所以我尝试将数字乘
  • 错误:来自角度控制器的 [ng:areq]

    这是一个很遥远的事情 但是以前有人见过这个错误吗 我正在尝试使用 Express Angular 和 mongoDB 添加 传输器 每当我访问由传输控制器控制的页面时 我都会收到此错误 Error ng areq http errors a
  • 如何正确配置node.js以使用自签名根证书?

    所以 在绝望的路上 我想知道是否有人在某个地方可以帮助我配置nodejs以接受根CA自签名 我需要它才能通过使用 TLS 的节点获取来访问开发中的自定义 API 环境 操作系统 Ubuntu 20 04 作为虚拟机中的来宾 Windows
  • 根据 JavaScript 中的另一个对象数组过滤对象数组

    我有一个像这样的数组 arr1 A red B blue Q green R blue B green M red Q white R blue 每个对象都有两个键 值对 一个字母和颜色 我有另一个像这样的数组 filter A val B
  • Perl:在复杂哈希内生成数组

    为了使我的数据更易于访问 我想将表格数据存储在复杂的哈希中 当脚本循环遍历我的数据时 我试图增长一个 HoHoHoA 根据 perldsc 中的指南 push hash column i date hour data i 该脚本编译并运行没
  • JBoss 上的 JaxWS ClassCastException

    我正在使用 JBoss 5 1 0 GA 适用于 JDK6 和 jaxws 2 2 6 当我调用 Web 服务时 出现以下异常 java util ServiceConfigurationError javax xml ws spi Pro
  • Kotlin 中的简单泛型函数失败

    这是 Kotlin 中的一个简单的泛型函数 fun
  • RGoogleDocs 和现在的 RGoogleData

    RGoogle文档太棒了 它允许人们在 Google 上存储数据并将其实时读取到 R 前几天我尝试将其安装在计算机上 结果发现我能找到的只是 RForge 中的 RGoogleData 这两个包之间有什么关系呢 我尝试在同一搜索中谷歌搜索
  • iOS HTML5 Canvas toDataURL

    我需要一些帮助 我们似乎在 iOS 上遇到了有关通过 HTML 5 Canvas 获取图像的 base64 的问题 如果我们使用画布的默认高度 宽度或对高度和宽度进行硬编码 一切都会正常工作 但是 如果我们将画布高度 宽度设置为图像 src
  • KSQL 表-表左外连接多次发出相同的连接结果

    使用 KSQL 并执行左外连接 我可以看到有时多次发出的连接结果 换句话说 相同的连接结果会被多次发出 我不是在谈论右侧具有空值的联接版本和不具有空值的版本 从字面上看 连接产生的同一条记录会被多次发出 我想知道这是否是预期的行为 一般答案
  • 如何在 Flutter 中嵌套 StreamBuilder?

    我有 2 个流 需要组合起来构建一个小部件 但与我见过的其他问题不同 我需要嵌套流 我有一个从 Firestore 获取文档集合的流 以及一个依赖于第一个文档的数据来获取文档子集合的流 我想将它们组合成一个流 但它们需要嵌套 因为每个文档都