Maison Applet WeChat Développement de mini-programmes Analyse de la différence entre l'exemple d'utilisation du composant d'image de l'applet WeChat et l'erreur dans js

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

Jun 27, 2018 pm 03:41 PM

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!

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Tutoriel Java
1663
14
Tutoriel PHP
1266
29
Tutoriel C#
1239
24