Flutter：无法显示来自图像 url firestore 的图像

Question

我尝试使用图片网址显示来自 Firestore 的数据。我使用 FutureBuilder 从 firestore 获取我的图像 url 值。但我有问题，因为我的图像无法显示和显示红屏。我在调试控制台中收到消息，例如：

引发了另一个异常：构建函数返回 null。

I/flutter (13506): 另一个异常被抛出: NoSuchMethodError: 在 null 上调用了方法“[]”。

I/flutter (13506): 另一个异常被抛出: NoSuchMethodError: “QuerySnapshot”类没有实例方法“[]”

这是我的代码：

ListTile(
  leading: new FutureBuilder(
    future: Firestore.instance.collection('users').where('uid', isEqualTo: _post['imgurl']).getDocuments(),
    builder: (BuildContext context, AsyncSnapshot snapshot){
      if(snapshot.hasData){
        if(snapshot.data != null){
          print(snapshot.data['imgurl']);
          return CircleAvatar(
            backgroundImage: NetworkImage(snapshot.data['imgurl']),
          );
        }
      }
    },
  ),
  title: Text('Richard');
)

你能告诉我我的错在哪里吗？

Answer 1

您的Future 返回一个文档列表，而不仅仅是一个。您正在尝试从 document 列表中获取文档的 imageUrl，而不是从其中之一。

您的snapshot.data 是一个文档列表，您可以在snapshot.data.documents 中找到它们。

如果您只对一个文档感兴趣，我建议您将您的 Future 更改为只返回一个文档的内容（例如获取第一个文档）。

如果您想保持 Future 的原样，只需从您的 snapshot.data 获取第一个文档并进行处理。

目前我无法提供更多示例，因为我无法在逻辑上做到这一点（我不在家），但如果我的建议不能帮助您解决问题，可以为您提供一些示例！

Answer 2

使用

Image.network(widget.snapshot.data['imgurl'])

这是我处理问题的方法：

Card(
                              margin: EdgeInsets.symmetric(
                              horizontal: 10.0, vertical: 6.0),
                              elevation: 8.0,
                              child:
                              Image.network(
                                widget.ds.data['GraphImg'],
                                fit: BoxFit.contain,
                              ),                           )

为我工作！

Answer 3

FadeInImage.assetNetwork(
width: 50.0,
height: 50.0,
fit: BoxFit.cover,
image:ContentThumbnail.thumbnails[index],
placeholder: 'images/placeholder.jpg',),),