Analyse de la différence entre l'exemple d'utilisation du composant d'image de l'applet WeChat et l'erreur dans js

Cet article présente principalement des informations pertinentes sur la différence entre l'exemple d'utilisation de binderror du composant d'image d'applet WeChat et l'erreur dans js. Les amis dans le besoin peuvent se référer à l'

Exemple d'utilisation de binderror de composant d'image d'applet WeChat ( correspondant à html , onerror in js)

binderror

HandleEvent

当错误发生时，发布到 AppService 的事件名，事件对象event.detail = {errMsg: 'something wrong'}

Dans le développement d'applets WeChat, nous utilisons une liste pour contenir des images Si le lien de l'image a une erreur 404, alors nous devons lui fournir une adresse URL conviviale par défaut. . Utilisez simplement l'événement onerror en HTML et js

<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="Analyse de la différence entre l'exemple d'utilisation du composant d'image de l'applet WeChat et l'erreur dans js" >

Le composant d'image de l'applet WeChat ne fournit pas d'événement onerror, mais fournit à la place un événement binderror.

Si l'image lie 404, cet événement binderror sera déclenché. Nous pouvons modifier la source de données correspondante dans l'événement lié, comme suit

Fichier .wxml

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

Fichier .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) //修改数据源对应的数据
 }

Erreurs courantes : this.setData( {"carlistData ["+errorImgIndex+"].img": object})Quelque chose comme ceci est incorrect

Ce qui précède est l'intégralité du contenu de cet article, j'espère qu'il sera utile à l'apprentissage de chacun, plus Veuillez payer attention au site PHP chinois pour le contenu associé !

Recommandations associées :

Comment utiliser ECharts pour charger des données de manière asynchrone dans les mini-programmes WeChat

Comment implémenter l'image dans les mini-programmes WeChat Méthode d'affichage adaptatif du rapport de largeur des images de composants

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!