时间戳

首页 > 解决方案 > 如果嵌套在子级中，则不会呈现 StreamBuilder 小部件：[]

dart - 如果嵌套在子级中，则不会呈现 StreamBuilder 小部件：[]

问题描述

我正在尝试从 Firebase 的 FireStore 数据库中读取数据并在颤振应用程序中显示为列表。

我遇到了这个问题，我需要让StreamBuilder成为 Widget Array 的一部分。如果StreamBuilder小部件是小部件的单个子级，则它可以正常呈现。但如果是子小部件数组的一部分，它就不起作用。例如

下面是我使用StreamBuilder的小部件

Widget postsListWidget = new StreamBuilder(
        stream: Firestore.instance.collection('baby').snapshots(),
        builder: (context, snapshot) {
          if (!snapshot.hasData) return const Text('Loading...');
          return new ListView.builder(
            itemCount: snapshot.data.documents.length,
            padding: const EdgeInsets.only(top: 10.0),
            itemExtent: 55.0,
            itemBuilder: (context, index) =>
                _buildListItem(context, snapshot.data.documents[index]),
          );
        });

这是我使用带有单个子父级的 StreamBuilder 小部件，例如容器

return new Scaffold(
        body: new Container(
      child: postsListWidget,
    )

上面的代码可以正常工作，因为Container只有一个“子”元素。

但是，如果我使用另一个可以有多个子级的小部件，例如 Row，StreamBuilder将不会呈现。例如

 return new Scaffold(
        body: new Row(
      children: <Widget>[postsListWidget],
    )

上面的代码不会渲染 StreamBuilder Widget。

我在调试窗口中收到以下错误

flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#9162d NEEDS-LAYOUT NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#9162d NEEDS-PAINT
flutter: Another exception was thrown: Tried to paint a RenderObject reentrantly.
flutter: Another exception was thrown: 'package:flutter/src/widgets/text.dart': Failed assertion: line 213 pos 15: 'data != null': is not true.
flutter: Another exception was thrown: Tried to paint a RenderObject reentrantly.

如果有人可以提供帮助，我将不胜感激，我只是找不到谷歌来帮助解决这个问题！！

标签： dartgoogle-cloud-firestoreflutter

解决方案

我认为您缺少对错误和数据的检查，如中所示

https://docs.flutter.io/flutter/widgets/StreamBuilder-class.html

new StreamBuilder<int>(
  stream: _lot?.bids, // a Stream<int> or null
  builder: (BuildContext context, AsyncSnapshot<int> snapshot) {
    if (snapshot.hasError)
      return new Text('Error: ${snapshot.error}');
    switch (snapshot.connectionState) {
      case ConnectionState.none: return new Text('Select lot');
      case ConnectionState.waiting: return new Text('Awaiting bids...');
      case ConnectionState.active: return new Text('\$${snapshot.data}');
      case ConnectionState.done: return new Text('\$${snapshot.data} (closed)');
    }
  },
)

推荐阅读