图片找不到的处理方案

在HTML中图片找不到的解决方法

• 在html中，img标签的图片路径资源找不到或者服务器上的图片损坏，除了能够用alt属性用文字提示图片的内容告诉用户外，还能够用onerror属性，用另一张专门用于处理图片容错的图片代替它，这里搭建了一个最简单的demo文件夹，里面包含一个html文件、一张须要上传的图片和一张解决容错的图片

• onerror属性的使用方法以下：

  onerror="this.src='XXX.jpg'"

• 具体实现方法以下：
  
• 正确的图片路径应该为example.jpg,此时，浏览器呈现出的图片是error_img.jpg：
  
• 而正确修改路径后：

小程序开发中处理图片找不到问题

• 在小程序开发中，处理图片错误的方法与html有区别，在官方文档中也给咱们了这样一个替代图片的方法：

• 在image标签中添加方法：

binderror="onImageError"

• 在相应的js文件中写一个咱们定义的处理图片错误的方法，这里咱们是onImageError方法：

onImageError: function(e){
    var index = e.currentTarget.dataset.index;  //获取咱们在image标签中传过来的data-index的数据，以获取下标
    var topList = this.data.topList; //获取data中接收咱们发出请求得到响应的数据
    var errorImageItem = topList[index]; //获取图片出错的对象
    errorImageItem.images.large = '../../images/error_img.jpg'; //把路径修改成咱们的替代图片
    topList[index] = errorImageItem; //把修改完路径后的对象覆盖原先的对象
    this.setData({
      topList: topList //从新赋值
    })
  }

• 处理后的结果以下：