vue图片不存在时加载默认图片
在文件中的img那里添加:οnerrοr="errorImg01",然后设置errorImg01的路径如果直接写成
errorImg01: ('../../assets/images/item_image.png'),会找不到这个图片
由于项目启动后, 图片的路径并不是我们写的路径了。所以我们用
errorImg01: 'this.src="' + require('../../assets/images/item_image.png') + '"'这个来请求图片。
<template>
<div class="goods_img">
<img :src="item.PicUrl" alt="" :onerror="errorImg01">
</div>
</template> <script> export default {
name: "ListItems",
data () {
return {
errorImg01: 'this.src="' + require('../../assets/images/item_image.png') + '"'
}
}
}
</script>
---------------------
作者:祗想安靜地。
来源:CSDN
原文:https://blog.csdn.net/jingjingshizhu/article/details/81315841
版权声明:本文为博主原创文章,转载请附上博文链接!
vue图片不存在时加载默认图片的更多相关文章
- js-页面需展示大量图片时,采用lyz.delayLoading.min.js,图片在屏幕时加载显示
本文本内容拷贝至:https://blog.csdn.net/xuanwuziyou/article/details/48199123 当一个网页中有大量图片时,浏览器会逐个去下载这些图片,等全部下载 ...
- 加载默认图片,如何避免img标签陷入onerror事件死循环
当图片加载失败的时候,我们可以利用onerror事件赋予它默认图片,但是问题来了,假如默认图片又不存在呢,即加载失败,这个时候就会陷入死循环. 为了避免死循环的情况,我们可以在执行完onerror事件 ...
- Vue.js项目中,当图片无法显示时则显示默认图片
使用require将图片进入,写法如下: data: () => ({logo: 'this.src="' + require('../assets/img.png') + '&quo ...
- 图片_ _Android有效解决加载大图片时内存溢出的问题 2
Android有效解决加载大图片时内存溢出的问题 博客分类: Android Android游戏虚拟机算法JNI 尽量不要使用setImageBitmap或 setImageResource或 Bit ...
- Android RecyclerView使用 及 滑动时加载图片优化方案
1.控制线程数量 + 数据分页加载2.重写onScrollStateChanged方法 这个我们后面再谈,下面先来看看RecyclerView控件的使用及我们为什么选择使用它 RecyclerView ...
- vue如何动态加载本地图片
大家好,我是前端队长Daotin,想要获取更多前端精彩内容,关注我(全网同名),解锁前端成长新姿势. 以下正文: 今天遇到一个在vue文件中引入本地图片的问题,于是有了这篇文章. 通常,我们的一个im ...
- Android开发中如何解决加载大图片时内存溢出的问题
Android开发中如何解决加载大图片时内存溢出的问题 在Android开发过程中,我们经常会遇到加载的图片过大导致内存溢出的问题,其实类似这样的问题已经屡见不鲜了,下面将一些好的解决方案分享给 ...
- Android ListView只加载当前屏幕内的图片(解决list滑动时加载卡顿)
最近在做ListView分页显示,其中包括图片 和文字(先下载解析文字内容,再异步加载图片)发现每次点击下一页后,文字内容加载完毕,马上向下滑动,由于这时后台在用线程池异步下载图片,我每页有20条,也 ...
- 【Android】首次进入应用时加载引导界面
参考文章: [1]http://blog.csdn.net/wsscy2004/article/details/7611529 [2]http://www.androidlearner.net/and ...
随机推荐
- Linux系统安装时分区的介绍
一般来说,在linux系统中都有最少两个挂载点,分别是/ (根目录)及 swap(交换分区),其中,/ 是必须的: 建议挂载的几大目录: /-------根目录,唯一必须挂载的目录.不要有任何的犹豫, ...
- eclipse导出java项目jar包(依赖第三方jar包)
一.在项目根目录下建一个文件:MANIFEST.MF 内容: Manifest-Version: 1.0 Class-Path: lib/commons-compress-1.9.jar lib/co ...
- Java中的可变参数
1.什么是可变参数 可变参数是JDK1.5的新特性,允许一个方式接受任意数量的参数 public static void main(String[] args) { print("a&quo ...
- Deepin 系统下设置Apache虚拟主机站点
1,在 var/www/html 文件夹中创建一个文件夹,命名为 a ,用来作为我们的PHP项目文件夹. 2,找到 etc/apache2/sites-available 文件夹,在文件夹中创建一个站 ...
- Mybaits 运行原理流程时序图
1 .初始化sqlsessionFactory 2openSession 3.getMapper返回接口的代理对象 包含了SqlSession对象 4.查询流程
- ssm+ajax异步请求返回list遍历
jsp页面 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnc ...
- 一、Appium+python环境搭建
一.环境准备 1.jdk1.8. (64位) 2.android-sdk_r24.3.4-windows 3.python:2.7(3.6也可以) 4.appium:1.4.13.1 5.Node.j ...
- Git:目录
ylbtech-Git:目录 1.返回顶部 1. https://git-scm.com/ 2. 2.返回顶部 1.Easy Git Integration Tools https://marketp ...
- PHP面向对象-设计模式 单例模式 简单工厂模式 工厂方法模式
1.单例模式 单例模式是一种常用的软件设计模式.在它的核心结构中只包含一个被称为单例的特殊类.通过单例模式可以保证系统中一个类只有一个实例.即一个类只有一个对象实例. 要实现每一个类只有一个实例,就需 ...
- 阶段3 1.Mybatis_01.Mybatis课程介绍及环境搭建_07.环境搭建的注意事项
2 resources下面创建目录要一级一级的创建,下面这个创建的就是一级目录而不是三级 在文件夹下看到的目录也是一级的 因此这里创建目录需要一个个的去创建 配置文件和dao类这两个目录要保持一致,这 ...