WeChat 애플릿 이미지 컴포넌트 바인더오류 사용예와 js의 onerror 차이점 분석

이 글은 위챗 애플릿 이미지 컴포넌트의 바인드에러 사용 예시와 js의 onerror 차이점에 대한 관련 정보를 주로 소개합니다. 필요하신 분들은 참고하시면 됩니다

위챗 애플릿 이미지 컴포넌트의 바인드에러 사용 예시(에 해당) onerror in html and js)

binderror

HandleEvent

오류가 발생하면 이벤트 이름이 AppService에 게시되고 이벤트 객체 event.detail = {errMsg: 'something 잘못된'}

In WeChat 애플릿 개발에서는 목록을 사용하여 이미지를 포함합니다. 이미지 링크에 404 오류가 있으면 기본 URL 주소를 제공해야 합니다. html 및 js에서 onerror 이벤트를 사용하세요.

<img  src="/static/imghwm/default1.png"  data-src="image.gif"  class="lazy"   onerror="this.src=&#39;https:w.chesudi.com/Public/web/img/onerrorcar.png&#39;" / alt="WeChat 애플릿 이미지 컴포넌트 바인더오류 사용예와 js의 onerror 차이점 분석" >

WeChat 애플릿 이미지 구성 요소는 onerror 이벤트를 제공하지 않지만 대신 바인딩오류 이벤트를 제공합니다.

이미지 링크가 404인 경우 이 바인딩 오류 이벤트가 발생합니다. 다음과 같이 바운드 이벤트에서 해당 데이터 소스를 수정하면 됩니다.

.wxml 파일

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

.js 파일

 binderrorimg:function(e){ 
  var errorImgIndex= e.target.dataset.errorimg //获取循环的下标
  var imgObject="carlistData["+errorImgIndex+"].img" //carlistData为数据源，对象数组
  var errorImg={}
  errorImg[imgObject]="https://w.chesudi.com/Public/web/img/onerrorcar.png" //我们构建一个对象
  this.setData(errorImg) //修改数据源对应的数据
 }

일반적인 실수: this.setData({"carlistData["+errorImgIndex+"].img": object})이와 같은 내용은 올바르지 않습니다.

위는 이 기사의 전체 내용입니다. 도움이 되기를 바랍니다. 모두 도움이 됩니다. 더 많은 관련 콘텐츠를 보려면 PHP 중국어 웹사이트에 주목하세요!

관련 권장 사항:

ECharts를 사용하여 WeChat 애플릿에서 데이터를 비동기적으로 로드하는 방법

WeChat 애플릿에서 이미지 구성 요소 그림의 적응형 너비 비율 표시를 구현하는 방법

위 내용은 WeChat 애플릿 이미지 컴포넌트 바인더오류 사용예와 js의 onerror 차이점 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!