时间戳

首页 > 解决方案 > 在 null 上调用了 getter 'image'

firebase - 在 null 上调用了 getter 'image'

问题描述

我正在尝试从云火存储中获取 url 列表并使用该从火基础存储中获取图像。

图像按预期加载，但控制台显示一些错误，如下所示。

I/flutter (24353): The following NoSuchMethodError was thrown during a 
scheduler callback:
I/flutter (24353): The getter 'image' was called on null.
I/flutter (24353): Receiver: null
I/flutter (24353): Tried calling: image
I/flutter (24353): When the exception was thrown, this was the stack:

我试过了。

StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance.collection('images').snapshots(),
      builder: (BuildContext context,
          AsyncSnapshot<QuerySnapshot> snapshot) {
        if (!snapshot.hasData) return new CircularProgressIndicator();
        switch (snapshot.connectionState) {
          case ConnectionState.waiting:
            return new Center(child: new CircularProgressIndicator());
          default:
            return new StaggeredGridView.countBuilder(
              padding: const EdgeInsets.all(8.0),
              crossAxisCount: 4,
              itemCount: snapshot.data.documents.length,
              itemBuilder: (context, i) {
                String imgPath = snapshot.data.documents[i]['link'];
                return new Material(
                  elevation: 8.0,
                  borderRadius:
                  new BorderRadius.all(new Radius.circular(8.0)),
                  child: new InkWell(
                    child: new Hero(
                      tag: imgPath,
                      child: new FadeInImage(
                        image: new NetworkImage(imgPath),
                        fit: BoxFit.cover,
                        placeholder: new AssetImage("images/images.jpg"),
                      ),
                    ),
                  ),
                );
              },
              staggeredTileBuilder: (i) =>
              new StaggeredTile.count(2, i.isEven ? 2 : 3),
              mainAxisSpacing: 8.0,
              crossAxisSpacing: 8.0,
            );
          }
        },
    )

标签： firebaseflutter

解决方案

如果图像加载正常但如您所提到的有空错误，则第一次运行可能Widget build()在NetworkImage(). 一种解决方法是对imgPath. 仅当图像 URL 不为空时，该placeholder参数才能正常工作，如此处所示。

FadeInImage(
    // if imgPath != null, display Networkimage, else display AssetImage
    image: (imgPath != null)? NetworkImage(imgPath) : AssetImage("images/images.jpg"),
    fit: BoxFit.cover,
),

这里的另一个选择是使用loadingBuilder和errorBuilder构造函数Image.network()

Image.network(
     imgPath,
     fit: BoxFit.cover,
     // display progress indicator
     loadingBuilder: (BuildContext context, Widget child,
         ImageChunkEvent loadingProgress) {
       if (loadingProgress == null) return child;
       return CircularProgressIndicator(
         value: loadingProgress.expectedTotalBytes != null
             ? loadingProgress.cumulativeBytesLoaded /
                 loadingProgress.expectedTotalBytes
             : null,
       );
     },
     // display error image
     errorBuilder: (BuildContext context, Object exception, StackTrace stackTrace) {
         debugPrint('Error loading image: $exception \n Stack trace: $stackTrace');
         return Image.asset('images/error_loading.png');
     },
),

推荐阅读