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

不言
Libérer: 2018-06-27 15:41:46
original
3348 Les gens l'ont consulté

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="image.gif" onerror="this.src=&#39;https:w.chesudi.com/Public/web/img/onerrorcar.png&#39;" />
Copier après la connexion

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>
Copier après la connexion

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) //修改数据源对应的数据
 }
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal