E企盈小程序营销工具技术服务商 热线:4006-838-530

微信小程序开发——设置默认图片、错误加载图片

E企盈小程序直播系统

wxml:image src='{{imgArr[index]==””?defaultImg:imgList[index]}}’  binderror=”errorFunction” data-errorimg=”{{index}}” /说明:     imgList: 图片数据源列表,需要在data中定义初始数据,或者从接口动态获取数据;errorFunction: 图片加载错误绑定的事件,错误图片替换为默认图片主要在这里操作;data-errorimg: 错误图片索引数据,需要在errorFunction中用以记录错误图片对应的位置;如果图片地址为空,是不会触发binderror的,所以就直接对图片地址做判断,如果为空,则替换为默认图片。js:data: {    imgArr:[],    //图片列表,接口动态获取    defaultImg: “../../../assets/img/defaultImg.png”,    //默认图片},……省略图片数据源获取代码……/** * 图片加载错误触发的事件 */errorFunction(e) {    if(e.type==”error”){      var errorImgIndex = e.target.dataset.errorimg //获取错误图片循环的下标      var imgList= this.data.imgArr                 //将图片列表数据绑定到变量      imgList[errorImgIndex] = this.data.defaultImg //错误图片替换为默认图片      this.setData({        imgArr: imgList      })    }}备注:使用这种方法,是需要将图片数据源放在data中的,这样才可以在 binderror 的事件中进行数据的替换,不可以直接在wxml中调用接口的数据。  转自:逍遥云天 微信小程序开发——设置默认图片、错误加载图片

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序开发——设置默认图片、错误加载图片
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏