微信小程序中image組件binderror使用例子與js中的onerror區(qū)別是什么

這篇文章將為大家詳細講解有關(guān)微信小程序中image組件binderror使用例子與js中的onerror區(qū)別是什么，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

成都創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設、高性價比沽源網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式沽源網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設找我們，業(yè)務覆蓋沽源地區(qū)。費用合理售后完善，10余年實體公司更值得信賴。

微信小程序image組件binderror使用例子(對應html、js中的onerror)

官方文檔

binderror

HandleEvent

當錯誤發(fā)生時，發(fā)布到 AppService 的事件名，事件對象event.detail = {errMsg: 'something wrong'}

在微信小程序開發(fā)中，我們使用列表包含圖片，如果這個圖片鏈接404錯誤，那么我們應該給它提供一個默認的友好URL地址。html和js中使用onerror事件就可以了

<img src="image.gif" onerror="this.src='https:w.chesudi.com/Public/web/img/onerrorcar.png'" />

微信小程序image組件沒提供onerror事件，提供了一個binderror事件來代替。

如果圖片鏈接404，就會觸發(fā)這個binderror事件，我們在綁定的事件里修改對應的數(shù)據(jù)源就好了，如下

.wxml文件

<image class="carlist_img" src="{{item.img}}" binderror="binderrorimg" data-errorimg="{{index}}"></image>

.js文件　

 binderrorimg:function(e){ 
  var errorImgIndex= e.target.dataset.errorimg //獲取循環(huán)的下標
  var imgObject="carlistData["+errorImgIndex+"].img" //carlistData為數(shù)據(jù)源，對象數(shù)組
  var errorImg={}
  errorImg[imgObject]="/upload/otherpic73/77161.png" //我們構(gòu)建一個對象
  this.setData(errorImg) //修改數(shù)據(jù)源對應的數(shù)據(jù)
 }

 易錯點：this.setData({"carlistData["+errorImgIndex+"].img"：對象})類似這樣的就不正確了

關(guān)于“微信小程序中image組件binderror使用例子與js中的onerror區(qū)別是什么”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。

當前文章：微信小程序中image組件binderror使用例子與js中的onerror區(qū)別是什么
標題來源：http://muchs.cn/article6/pisdig.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供企業(yè)建站、網(wǎng)站改版、域名注冊、ChatGPT、品牌網(wǎng)站設計、品牌網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)