微信小程序 官方文档对image 媒体组件加载失败 没有太多的解释,使用中出现了几个小问题,今天抽空记录一下

WXML:

<image class="userinfo-avatar" src="{{avatar}}" binderror="errorFunction"></image>

JS:

errorFunction: function(){
this.setData({
avatar: '/image/head.png'
})
}

WXML:

<view wx:for="{{branchList}}" wx:key="{{key}}" wx:for-index='index'>
<image src='{{item.branch_photo}}' binderror="errorFunction" data-index='{{index}}'></image>
</view>
errorFunction: function (event) {
console.log(event)
var index = event.currentTarget.dataset.index
var img = 'branchList['+index+'].branch_photo'
this.setData({
[img]: '/pages/resource/img/loading.gif'
})
}


微信小程序 图片加载失败处理方法的更多相关文章

  1. 微信小程序 图片加载失败处理方案

    小程序端展示网络资源图片可能会失败,下面介绍一种自己的处理方法 1. js文件中判断图片 url 是否存在,存在则正常显示,不存在则替换url为本地默认图片 2. 当图片 url 存在,但是加载失败时 ...

  2. 微信小程序分包加载实战

    "离线包"机制 微信小程序采用的是类似离线包加载方案,以转转小程序为例,当用户第一次打开时会先下载好所有代码,然后再加载页面:当用户再次进入转转小程序时,会直接使用已下载的代码,省 ...

  3. 微信小程序 - 分包加载

    小程序开发大家都知道,对主包的大小进行了限制,从最初的1M变成了现再的2M,一般情况下是够用了:但是偶尔可能会出现超出2M的可能,我们可以对小程序进行分包加载. 1.小程序分包加载 a. 某些情况下, ...

  4. js 图片加载失败处理方法

    在项目中不可避免会用到图片,尤其是列表,有时候图片会加载失败:这样就会显示一个很难看的坏图片缩略图:下面介绍两种方法,解决这个问题: 1.如果在你的项目中有引入jQuery插件,你可以使用error( ...

  5. [转]微信小程序之加载更多(分页加载)实例 —— 微信小程序实战系列(2)

    本文转自;http://blog.csdn.net/michael_ouyang/article/details/56846185 loadmore 加载更多(分页加载) 当用户打开一个页面时,假设后 ...

  6. 微信小程序列表加载更多

    概述 基于小程序开发的列表加载更多例子. 详细 代码下载:http://www.demodashi.com/demo/13632.html 一.前言 基于小程序开发的列表加载更多例子. 二.运行效果 ...

  7. 微信小程序室内地图导航开发-微信小程序JS加载esmap地图

    一.在微信小程序里显示室内三维地图 需要满足的两个条件 调用ESMap室内地图需要用到小程序web-view组件,想要通过 web-view 调用ESMap室内地图需要满足以下 2 个条件: 1. 小 ...

  8. 微信小程序 - 分包加载(独立分包)

    独立分包是小程序中一种特殊类型的分包,可以独立于主包和其他分包运行.从独立分包中页面进入小程序时,不需要下载主包.当用户进入普通分包或主包内页面时,主包才会被下载 将某些具有一定功能独立性的页面配置到 ...

  9. 微信小程序分包加载

    分包加载 某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载. 在构建小程序分包项目时,构建会输出一个或多个功能的分包,其中每个分包小程序必定含有一个主 ...

随机推荐

  1. Spring 框架的概述以及Spring中基于XML的IOC配置

    Spring 框架的概述以及Spring中基于XML的IOC配置 一.简介 Spring的两大核心:IOC(DI)与AOP,IOC是反转控制,DI依赖注入 特点:轻量级.依赖注入.面向切面编程.容器. ...

  2. PB 奇葩BUG

    1. 在数据窗口的Edit 中选则CHeckBox 后,必须给默认值,否则会导致数据保存不了,也无提示. 2.当使用数据窗口的 setfile()函数时 如果 条件中有两个LIKE 则会报错,一个LI ...

  3. 记录Quarter的基本使用

    原文:记录Quarter的基本使用 using Quartz; using Quartz.Impl; using Quartz.Impl.Matchers; using Quartz.Logging; ...

  4. RabbitMQ实战

    RabbitMQ消息队列 一.Hello World 1.amqp-client客户端依赖 2.Rabbitmq类与方法 二.交换机类型 Exchange Type 1.消息轮询分发(Round Ro ...

  5. python3基础之“函数(2)”

    1.def:定义一个函数 def f(x): return x+1 #返回函数值 a=f(2) print(a) >>3 def even_odd(x): if x%2==0: " ...

  6. 为什么Java中一个char能存下一个汉字

    在Java中,char的长度是2字节,即16位,2的16次方是65536. 1.如果采用utf-8编码,一个汉字占3个字节,char为什么还能存下一个汉字呢? 参考:https://developer ...

  7. js实现图片上传本地预览

    演示地址:https://xibushijie.github.io/static/uploadImg.html <!DOCTYPE> <html> <head> & ...

  8. XML 约束

    XML约束 一.约束 约束:规定 xml 文档的书写规则 要求: 1.能够在 xml 中引入约束文档 2.能够简单的读懂约束文档 分类: 1.DTD:一种简单的约束技术(后缀.dtd) 2.Schem ...

  9. UI5-技术篇-Hybrid App-3-Fiori 百度地图应用

    上一次在Jsbin中测试了百度地图应用:UI5-技术篇-Hybrid App-3-jsbin百度地图 ,主要思路:1.加载百度API  2.自定义控件  3.div标签加载地图,本文主要将相关实施过程 ...

  10. 小米cc9和vivo z5 对比

    (一)大致对比 1.小米 cc9(6GB+128GB.  1899元. 白色恋人(白色)) https://item.mi.com/product/10000163.html 2.vivo Z5 (6 ...