vue图片img加载失败显示自定义默认图片(缺省图)
vue图片img加载失败显示自定义默认图片(缺省图)
1.图片加载示例
2.加载失败显示默认图片
3.加载失败默认图片代码处理
<div class="book-img"><img v-if="item.coverImg" :src="item.coverImg" @error="errorImg($event)" /></div> /**图片加载失败显示自定义默认图片(缺省图)*/errorImg (e) {// console.log(e.target.src,"法1")// console.log(e.srcElement.src,"法2")e.srcElement.src=require('../../src/assets/no-img.png');//这一句没用，如果默认图片的路径错了还是会一直闪屏，在方法的前面加个.once只让它执行一次也没用e.srcElement.onerror=null; //防止闪图}, 如果觉得可以就点个
vue图片加载失败时用默认图片替换的方法 前言 本文主要给大家介绍的关于vue实现图片加载失败时用默认图片替换的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧 方法如下 原理 ... 原文地址:http://blog.csdn.net/qq_24771775/article/details/50294931 img元素加载图片失败,则变成一个小图标,让页面变得难看.此时如何替换为默 ... 背景:图片资源加载不出来时用默认图片替换 解决方法: 一,用js方法onerror: 1,直接在html标签中使用 复制代码 2,原生js方法: document.getElementById(' ... 前端img标签中引用后端交给的图片地址时,有可能这个路径下图片被删除或者损坏了,那么页面在加载img图片时就显示为,太丑了. img标签有个onerror事件,就是当图片未被正确加载的时候调用此事件, ... HTML: <img src='${defalutImg}' data-src="${fileDomain }/images/${poi.firstPic}" width=& ... 在项目中经常会遇到图片加载失败需要显示默认图片的场景,那么如何在图片src资源加载失败显示出默认的图片呢? 方法一:onerror <img src="原来要加载的资源" o ... 一.解决方法(在单层循环中) HTML: 在image标签当中添加@error,用来监听图片地址加载失败,同时传递参数 <image v-else :src="item" m ... 首先看一下显示效果,如下图所示: 1.首先修改图片,在option对象中加入 下方代码就可实现图片的修改,但是存在bug symbol:'image://https://ss2.bdstatic.co ... img标签图片加载失败显示图片 onerror="οnerrοr=null;src='../../image/community/initialize_img.png'"vue图片img加载失败显示自定义默认图片(缺省图)相关推荐
最新文章
热门文章