微信小程序开发设置默认图片,加载图片错误
2019-07-31 09:46:07 来源:沈阳小程序开发 作者:沈阳软件开发
小程序不支持h5中的onerrorimg,只启用了binderror属性。发生错误时,它会发布到AppService,事件对象event.detail={errMsg:'错误'}。
在线检查,没有很好的解决方案,有几个案例没有达到预期的效果。
结合我之前看到的情况,他们中的大多数使用修改后的数据源用默认图片替换错误图片,但是有很多代码没有完全发布,因此不容易理解。
以下是根据您遇到的情况,图片为空,图片路径错误,相关代码如下,相关数据有说明:
wxml:
说明:imgList:图像数据源列表,需要在数据中定义初始数据,或者从接口动态获取数据; errorFunction:图像加载错误绑定事件,错误图片主要由默认图片替换; data-errorimg:error需要在errorFunction中使用图像索引数据来记录与错误图片对应的位置。如果图片地址为空,则不会触发binderror,因此直接判断图片地址。如果为空,则将其替换为默认图片。
js:data: {imgList:"", //图片列表,动态获取defaultImg: "../../../assets/img/defaultImg.png", //默认图片},......省略图片数据源获取代码....../*** 图片加载错误触发的事件*/errorFunction: function (e) {if(e.type=="error"){var errorImgIndex = e.target.dataset.errorimg //获取错误图片循环的下标var imgList= this.data.imgList //将图片列表数据绑定到变量imgList[errorImgIndex] = this.data.defaultImg //错误图片替换为默认图片this.setData({evaluteUserPic: evaluteUserPic})}}
注意:使用此方法,您需要将图像数据源放入数据中,以便在发生binderror时可以替换数据,不能直接在wxml中调用接口数据。
< 汇海(www.hvihi.com)是国内知名的商城系统和商城网站建设提供商,其中汇海技术小程序系统提供小程序商城开发,小程序配送系统,微分配系统,商城系统,电子商务网站建设, 微信发行系统,小程序商城及其他多端商场和电子商务行业解决方案>
确认:这个文件和图像源网络编辑器的网站部分,如果有侵权及时通信删除。 汇海hvihi.com网站原创文章,请注明出处。
“沈阳软件公司”的新闻页面文章、图片、音频、视频等稿件均为自媒体人、第三方机构发布或转载。如稿件涉及版权等问题,请与
我们联系删除或处理,客服QQ:55506560,稿件内容仅为传递更多信息之目的,不代表本网观点,亦不代表本网站赞同
其观点或证实其内容的真实性。
热门文章
使用“扫一扫”即可将网页分享至朋友圈。