這篇文章主要介紹微信小程序中image組件binderror怎么用,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
微信小程序image組件binderror使用例子(對(duì)應(yīng)html、js中的onerror)
binderror | HandleEvent | 當(dāng)錯(cuò)誤發(fā)生時(shí),發(fā)布到 AppService 的事件名,事件對(duì)象event.detail = {errMsg: 'something wrong'} |
在微信小程序開發(fā)中,我們使用列表包含圖片,如果這個(gè)圖片鏈接404錯(cuò)誤,那么我們應(yīng)該給它提供一個(gè)默認(rèn)的友好URL地址。html和js中使用onerror事件就可以了
微信小程序image組件沒提供onerror事件,提供了一個(gè)binderror事件來代替。
如果圖片鏈接404,就會(huì)觸發(fā)這個(gè)binderror事件,我們?cè)诮壎ǖ氖录镄薷膶?duì)應(yīng)的數(shù)據(jù)源就好了,如下
.wxml文件
.js文件
binderrorimg:function(e){ var errorImgIndex= e.target.dataset.errorimg //獲取循環(huán)的下標(biāo) var imgObject="carlistData["+errorImgIndex+"].img" //carlistData為數(shù)據(jù)源,對(duì)象數(shù)組 var errorImg={} errorImg[imgObject]="/tupian/20230522/404.html this.setData(errorImg) //修改數(shù)據(jù)源對(duì)應(yīng)的數(shù)據(jù) }
易錯(cuò)點(diǎn):this.setData({"carlistData["+errorImgIndex+"].img":對(duì)象})類似這樣的就不正確了
以上是“微信小程序中image組件binderror怎么用”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!