时间戳

首页 > 解决方案 > Flutter：返回时在 Firestore 中获取我的数据数组时输出不稳定

flutter - Flutter：返回时在 Firestore 中获取我的数据数组时输出不稳定

问题描述

在获取我的数据数组时，我的反应非常不稳定。我在卡片列表中显示这些数据。我说不稳定，因为每次我在我的应用程序中转到另一个导航时，我都会回到输出数据的那个导航。它首先显示红色背景，然后显示数据一百万秒。有人知道怎么修这个东西吗？我只是flutter / android的新手。请帮忙。

对于红色背景，它在终端上显示并输出我得到的数据。

The following NoSuchMethodError was thrown building StreamBuilder<QuerySnapshot>(dirty, state: _StreamBuilderBaseState<QuerySnapshot, AsyncSnapshot<QuerySnapshot>>#dac03):
The getter 'documents' was called on null.
Receiver: null
Tried calling: documents

我的代码：

StreamBuilder<QuerySnapshot>(
                stream: db.collection('ACTIVITIES').snapshots(),
                builder: (context, snapshot) {
                  final issuesList = snapshot.data.documents
                      .map((doc) => doc['Issue'].map<Widget>((issue) => buildItem(issue)).toList())
                      .toList();
                  return Column(
                      children: issuesList.expand<Widget>((issue) => issue).toList()
                  );
                })

我的数据库结构：

在此处输入图像描述

请帮忙。

标签： flutterdartgoogle-cloud-firestore

解决方案

您面临的问题是内部StreamBuilder,snapshot.data是null然后数据到达。这就是为什么您看到带有错误的红屏然后它可以正常工作的原因。

首先，当你使用 a 时，StreamBuilder你应该检查是否snapshot.data有东西，然后开始使用数据。你可以snapshot.hasData像这样使用：

StreamBuilder<QuerySnapshot>(
  stream: db.collection('ACTIVITIES').snapshots(),
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      return Column(...);
    }
    return Text('Loading...');
  },
)

有了这个，您现在将看到'Loading...'错误的红色屏幕而不是红色屏幕，当数据到达时，您将正常看到数据。

现在，当您转到另一个屏幕并返回时，该build()方法再次触发，并且StreamBuilder将再次从流中获取数据。即使 Firestore 缓存了数据，也可能需要一段时间才能使用，以便您获取null，然后缓存的数据就会到达。它不会像第一次那样花费太长时间，但您可能会看到'Loading...'。

为避免'Loading...'在您第一次收到数据后显示，您可以使用内存缓存并将其设置为initialDataon StreamBuilder，如下所示：

QuerySnapshot cache; // declare this outside build()

StreamBuilder<QuerySnapshot>(
  initialData: cache,
  stream: db.collection('ACTIVITIES').snapshots(),
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      return Column(...);
    }
    cache = snapshot.data;
    return Text('Loading...');
  },
)

有了这个，我认为你可以解决你的问题。如果您想查看更多建议，请查看：如何在 Flutter 中缓存 Firebase 数据？

推荐阅读