<img :src="item.url? item.url: '' " alt :onerror="defaultImg" />

这里一定要判断src,不然接口返回url为null时,后面的onerror不生效

computed: {
defaultImg () {
return 'this.src="' + require('@/assets/img/default-img.png') + '"'
}
},

动态设置背景图

:style="{backgroundImage: 'url('+图片地址+')'}"

vue处理图片路径出问题时显示默认图片的更多相关文章

  1. JS检查当图片不存在时显示默认图片和键盘大小写键状态

    当图片不存在时显示默认图片 <script type="text/javascript"> var imgs = document.images; for(var i ...

  2. vue判断图片为空或者图片加载不成功时显示默认图片

    纯css解决方案: <img src="broken.png" alt=""> img { position: relative; } img:af ...

  3. Jquery判断页面图片是否加载失败,加载失败则显示默认图片

    例子: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...

  4. vue中的图片加载与显示默认图片

    HTML: <div class="content-show-img"> <div class="show-img"> <img ...

  5. 在HTML中显示图片时希望如果图片不存在或者无法显示时,能够显示默认图片

    很多时候,在HTML中显示图片时希望如果图片不存在或者无法显示时,能够显示默认图片.可以通过以下方式: <img src="xxx.jpg" onError="th ...

  6. img如果没有图片显示默认图片效果

    img如果没有图片显示默认图片效果<img src="本来要显示的图片URL" onerror="this.src='图片挂了的话要显示的默认图片URL'" ...

  7. vue中img图片加载中以及加载失败显示默认图片问题

    加载中默认图片:主要是onload事件监听,data中定义变量 imgSrc :require('./default.png'): <div class="per-pic" ...

  8. js处理img标签加载图片失败,显示默认图片

    1.第一种方法: 如果已经引入了jquery插件,就很好办.没有的话,如果实在需要,可以附上代码: script(type='text/javascript', src="http://aj ...

  9. img图片不存在时设置默认图片

    当在页面显示的时候,万一图片被移动了位置或者丢失的话,将会在页面显示一个带X的图片,很是影响用户的体验.即使使用alt属性给出了"图片XX"的提示信息,也起不了多大作用. 其实,可 ...

  10. js解决img标签加载失败显示默认图片

    问题: 为所有显示楼盘的页面添加一个加载失败的默认图片. 基本思路: img标签中有个onerror属性,专门用来处理加载失败的事件.所以可以用jquery添加onerror属性,在onerror中加 ...

随机推荐

  1. “你帮我助”软件开发(Final)

    本项目是上海交通大学 CS-3331 软件工程课程大作业. 作业描述 "你帮我助"软件开发(Final) 新的功能需求: 物品有公共的信息(物品名称,物品说明,物品所在地址,联系人 ...

  2. mysql 死锁解决

    查看锁记录等待时间: SHOW VARIABLES LIKE 'innodb_lock_wait_timeout'; 把超时等待时间修改为5秒: SET innodb_lock_wait_timeou ...

  3. 认识流媒体协议,从 RTSP 协议解析开始!

    RTSP 是 Internet 协议规范,是 TCP/IP 协议体系中的一个应用层协议级网络通信系统.专为娱乐(如音频和视频)和通信系统的使用,以控制流媒体服务器.该协议用于在端点之间建立和控制媒体会 ...

  4. GPSSworld仿真(一):程序题——单窗口排队系统

    3.3 一个仓库共存放了2000吨货物,货物以三种规模出库,少量(10吨),中等(20吨),大量(50吨),分别以10±5分,15分,30±10分的速率出库.如果没有货位达到的情况下,一个仓库能维持供 ...

  5. 详解uniapp和vue在路由方面的不同和联系

    Uniapp 和 Vue 在路由方面有相似之处,因为 Uniapp 是基于 Vue 的.Uniapp 的路由系统是通过 Vue Router 实现的,因此两者有许多相同的概念和 API. 相同点: 都 ...

  6. Trie(字典)树模板

    模板 int son[N][26], cnt[N], idx; // 0号点既是根节点,又是空节点 // son[][]存储树中每个节点的子节点 // cnt[]存储以每个节点结尾的单词数量 // 插 ...

  7. H5-生成二维码

    <div class="poster-qr"> <div class="qrWrapper"> <!-- 放置二维码的容器 --& ...

  8. OPP前三次作业总结

    OPP前三次作业总结 目录 前言: 第一次OOP训练: 7-7 有重复的数据 设计与分析: 具体代码 踩坑心得 改进建议 7-8 从一个字符串中移除包含在另一个字符串中的字符 设计与分析: 具体代码 ...

  9. # SpringBoot使用Validation校验参数 ##

    SpringBoot使用Validation校验参数 一.简介 参考 (14条消息) 1. 不吹不擂,第一篇就能提升你对Bean Validation数据校验的认知_@decimalmax和@max_ ...

  10. kubernetes (k8s) v1.24.0 安装dashboard面板

    kubernetes (k8s) v1.24.0 安装dashboard面板 介绍 v1.24.0 使用之前的安装方式,在安装过程中会有一些异常,此文档已修复已知问题. 下载所需配置 root@k8s ...