【问题标题】:Flutter Streambuilder returning loopFlutter Streambuilder 返回循环
【发布时间】:2021-07-26 15:25:59
【问题描述】:

我有来自我的 firebase 的数据,为了简化我的代码,我想返回一个包含所有元素的循环。这是我的 Streambuilder:

Column(
      children: <Widget>[
        Container(
          height: 300,
          width: double.infinity,
          child: Image.network(
            widget.image,
            fit: BoxFit.cover,
          ),
        ),
        StreamBuilder(
            stream: FirebaseFirestore.instance
                .collection(
                    '/towns/${widget.townId}/beacons/${widget.beaconId}/content')
                .snapshots(),
            builder: (ctx, snapshot) {
              if (snapshot.connectionState == ConnectionState.waiting)
                return CircularProgressIndicator();
              final contents = snapshot.data.docs;
              for (int i = 1; i <= 10; i++) {
                return Column(
                  children: [
                    contents[1]['sectionTitle$i'].isNotEmpty
                        ? buildSectionTitle(
                            context, contents[1]['sectionTitle$i'])
                        : Container(),
                    contents[1]['text$i'].isNotEmpty
                        ? buildText(context, contents[1]['text$i'])
                        : Container(),
                    contents[1]['audio$i'].isNotEmpty
                        ? Audio(contents[1]['audio$i'], key: UniqueKey())
                        : Container(),
                    contents[1]['image$i'].isNotEmpty
                        ? buildImage(context, contents[1]['image$i'])
                        : Container(),
                  ],
                );
              }
              return Container();
            }),
      ],
    ),

在我的 Firebase 中,我的所有元素(sectionTitle1、sectionTitle2 等)都在同一个文档中(这里是 contents[1])。问题是 Streambuild 只返回我循环的第一个元素。例如,如果我开始 i = 1,则循环将返回 sectionTitle1、text1、audio1 和 image1;如果我开始 i = 3,循环将返回 sectionTitle3、text3、audio3 和 image3。我怎样才能退货?

【问题讨论】:

  • 不要在StreamBuilder的参数中创建流!每次 build() 调用都会重新启动流,并很快耗尽您的免费层。 :)

标签: firebase flutter loops dart google-cloud-firestore


【解决方案1】:

更新答案

你可以试试这个方法,它可能会解决你的问题:

return Column(
  children: [
    for (int i = 1; i <= 10; i++) ...[
      contents[1]['sectionTitle$i'].isNotEmpty
        ? buildSectionTitle(
          context, contents[1]['sectionTitle$i'])
        : Container(),
      contents[1]['text$i'].isNotEmpty
        ? buildText(context, contents[1]['text$i'])
        : Container(),
      contents[1]['audio$i'].isNotEmpty
        ? Audio(contents[1]['audio$i'], key: UniqueKey())
        : Container(),
      contents[1]['image$i'].isNotEmpty
        ? buildImage(context, contents[1]['image$i'])
        : Container(),
    ]
  ]
);

这样您就不必为每次迭代创建一个列。 并在末尾删除return Container();

之前的错误答案

您使用的是 content[1] 而不是 content[i],因此您的循环中将始终有 docs[1] 的结果

【讨论】:

  • 嗨 Arnaud,所有元素(sectionTitle1、text3、image7 等)都在同一个文档中。这里只是文档编号 1。
  • 哦!我的错,我读得太快了你的问题,我正在编辑答案
  • 运行良好,非常感谢 Arnaud。我不知道可以将循环放在 Column() 中。使用“...”它工作得很好,所以我有最后一个问题:函数前面的“...”是什么意思?
  • 它被称为Spread运算符,这里是文档:dart.dev/guides/language/language-tour#spread-operator
猜你喜欢
  • 2020-07-12
  • 2021-04-19
  • 2019-10-01
  • 2019-09-28
  • 2021-01-28
  • 2020-12-19
  • 2021-09-10
  • 2021-03-30
  • 2018-12-28
相关资源
最近更新 更多