微信小程序图片加载失败时替换为默认图片的方法

wxml代码

<view wx:for="{{imageList}}" wx:for-index="index" wx:for-item="item" wx:key="navItems">
        <image  src="{{item.img}}" binderror="errorFunction" data-index='{{index}}' mode="widthFix" />
</view>

js代码

Page({
  data: {
    imageList:[
      {
      id:1,
      name:'苹果',
      img:'/images/service/1.jpg'
      },
      {
        id: 2,
        name: '香蕉',
        img: '/images/service/2.jpg'
      },
      {
        id: 3,
        name: '哈密瓜',
        img: '/images/service/3.jpg'
      },
      {
        id: 4,
        name: '橙子',
        img: '/images/service/4.jpg'
      },
    ],
  },
  onLoad: function () {
  },
  //图片加载失败时
  errorFunction: function (event) {
    var index = event.currentTarget.dataset.index
    var img = 'imageList[' + index + '].img'
    this.setData({
      [img]: '/images/img_default.jpg'
    })
  }
})