Flutter中DecorationImage()的onError方法

Question

代码工作正常，但由于我的互联网连接不可靠，我面临 NetworkImage.load 的问题（请参见下面的错误图片）

Container(
 width: 60,
 height: 80,
 decoration: BoxDecoration(
  color: Colors.black12,
  borderRadius: BorderRadius.all(Radius.circular(7.0))
  image: DecorationImage(
   image: NetworkImage(trend['imageUrl']),
   onError: <how we can handle this?>,
   fit: BoxFit.cover
  ),
 ),
);

我希望这个问题可以通过在 onError 方法上处理来解决（如果我错了请纠正我）。但我不知道该怎么做。

错误：

提前致谢

Answer 1

首先假设您在 class 中初始化了 NetworkImage。喜欢：

var imgVariable = NetworkImage(trend['imageUrl']);

然后，加载您的网络图像。如果发生错误，那么我们将从我们的资产中加载，让用户知道我们无法加载网络图像。

Container(
 width: 60,
 height: 80,
 decoration: BoxDecoration(
  color: Colors.black12,
  borderRadius: BorderRadius.all(Radius.circular(7.0))
  image: DecorationImage(
   image: imgVariable,
   onError: (errDetails){
       setState(){
           imgVariable = AssetImage('assets/could_not_load_img.jpg');
       };
   },
   fit: BoxFit.cover
  ),
 ),
);

这里，assets/could_not_load_img.jpg是信息性的图片。

*注意：这似乎无法解决错误，但这可能是我想出的方法。有像 cached_network_image 这样的插件可以很好地处理网络图像。

Flutter中DecorationImage()的onError方法

onError method of DecorationImage() in Flutter

flutter

flutter-layout

flutter-image