flutter_firebase 的 StreamBuilder 在第二个小部件构建时具有空值（图像消失）

Question

我设法在页面上使用 streambuilder 显示来自 firestore 的图像，但问题是如果我返回最后一页，图像就会消失（我得到一个空 snapshot.data 值）然后回来。

这是我的代码。如何使快照数据持久化，以便图像保留在那里并且在小部件重建时不会消失？

Container(child: Column(
      children: [
        Text('    Certifications',
        Container(child: StreamBuilder(
           stream: certificates,
           builder: (context, snapshot) {
             return !snapshot.hasData
              ? Center(child: Container(
                  child: Center(child: Text(
                    'No images yet'))))
              : Container(
                 child: GridView.builder(
                   itemCount: snapshot.data.documents.length,
                   itemBuilder: (context, index) {
                     url = snapshot.data.documents[index].get('url');
                     return Container(child: FadeInImage
                         .memoryNetwork(fit: BoxFit.cover,
                            placeholder: kTransparentImage,
                            image: url),
              ),
            );
         }),
      );
   }),
 ),

Answer 1

流是异步的。这意味着 StreamBuilder 不会获取旧快照，只会获取新的未来快照。这是你的问题。

当您的小部件被重建时，它正在订阅一个已经有事件的流。是的，您会认为快照中的数据应该是最后一个事件值，但事实并非如此。它将 null 直到将新事件推送到您的 certificates 流。

因此，一种解决方案是让正在加载您的证书的服务存储初始 API 请求的值，并使您可以在 StreamBuilder 的 initialData [=26= 中使用该值].

我会这样构造它：

StreamBuilder(
    stream: certificateService.stream,
    initialData: certificateService.value, // <-----
    builder: ...
)

希望这能为您指明正确的方向。

flutter_firebase 的 StreamBuilder 在第二个小部件构建时具有空值（图像消失）

StreamBuilder with flutter_firebase has null value on second widget build (image disappears)

firebase

flutter

stream-builder