Vue 中载入默认图片

在开发中，当遇到图片未能正确显示时，载入一张默认图片。这里介绍下方法：对于单张图，下面的是可以实现的：

<image mode="scaleToFill":src="imgurl" @error="handleImageError" />

handleImageError(event) {
      event.target.src = '/static/images/default.png';
      // 控制不要一直跳动
      event.target.onerror = null;
},

但如果，是一个列表，那么以上代码就有些问题。需要调整为：

<view v-for="(data, index) in list" :key="index">
    <image mode="scaleToFill":src="data.imgurl" @error="handleImageError($event,index)" />
</view>

handleImageError(event,index) {
    this.list[index].imgurl = '/static/images/default.png';
},

通过获取到错误，及所在图片索引号，将数据列表中对应图片地址重新修改成默认图片路径即可。