为什么FadeInImage在图片加载成功后仍显示占位符？

Question

  FadeInImage(
    fit: BoxFit.cover,
    image: ResizeImage(
        NetworkImage(snapshot.data!.artUri.toString(),
            headers: const {
              'User-Agent':
                  'Mozilla/5.0 (Linux; U; Android 8.1.0; zh-cn; BLA-AL00 Build/HUAWEIBLA-AL00) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/57.0.2987.132 MQQBrowser/8.9 Mobile Safari/537.36',
            }),
        width: 100),
    placeholder: MemoryImage(kTransparentImage),
    imageErrorBuilder: (context, url, error) {
      return const Image(
        image: ResizeImage(AssetImage('assets/images/album.png'),
            width: 100),
      );
    },
  ),
))),

当图片加载失败后会显示imageErrorBuilder，再更改snapshot.data!.artUri为正常Uri并且重新构建后会一直显示占位符(一片白色),即使在Devtools Network中看到图片请求成功且没有异常，仍为占位符，不会显示图片

Answer 1

基本用法：

FadeInImage.assetNetwork(
            placeholder: 'assets/loading.gif',
            image: 'https://picsum.photos/250?image=9',
          )

placeholder: 本地的一张图片
image: 是图片的url

你上面的image属性是一个组件（不是图片url）估计这里有问题；可以使用上面的基本用法逐步添加代码排查一下