vue里,img加载错误的时候,onerror属性可以加载错误图片的默认图片写法如下:

 <img class=avator' :src="data.picture" :onerror="defaultImg">

 data(){
return {
defaultImg: 'this.src="' + require('../../assets/images/moren.png') + '"'
}
}

vue图片onerror加载路径写法的更多相关文章

  1. Vue图片懒加载插件

    图片懒加载是一个很常用的功能,特别是一些电商平台,这对性能优化至关重要.今天就用vue来实现一个图片懒加载的插件. 这篇博客采用"三步走"战略--Vue.use().Vue.dir ...

  2. Vue图片懒加载之lazyload插件使用

    当内容没有加载完的时候,用户体验不是很好,这时候,可以使用lazyload这个插件,提升用户体验,使用方法特别简单易用 一. vue lazyload插件: 插件地址:https://github.c ...

  3. VUE图片懒加载-vue lazyload插件的简单上手使用(优化版本)

    在用VUE做项目开发的过程中,首页用到了懒加载的方法,查找了一些方法,觉得官网写得太复杂,有一篇博客不错(https://www.cnblogs.com/xyyt/p/7650539.html),但是 ...

  4. vue图片预加载

    目的: 图片预加载能够使得用户在浏览后续页面的时候,不会出现图片加载一半导致浏览不流畅的情况. 一.方法一 项目打开的时候要对图片进行预加载,在App.vue里面的beforeCreate添加预加载程 ...

  5. vue 图片懒加载 vue-lazyload

    图片懒加载 在实际的项目开发中,我们通常会遇见这样的场景:一个页面有很多图片,而首屏出现的图片大概就一两张,那么我们还要一次性把所有图片都加载出来吗?显然这是愚蠢的,不仅影响页面渲染速度,还浪费带宽. ...

  6. Vue图片懒加载

    图片懒加载的原理 先将img标签中的src链接设为同一张图片(空白图片),将其真正的图片地址存储再img标签的自定义属性中(比如data-src).当js监听到该图片元素进入可视窗口时,即将自定义属性 ...

  7. vue-lazyload 的使用(vue图片懒加载)

    github地址:https://github.com/hilongjw/vue-lazyload npm i vue-lazyload -S 或者 <script src="http ...

  8. VUE图片懒加载-vue lazyload插件的简单使用

    序:vue项目时候,我们要对图片进行懒加载处理,这个开发项目中就不需要自己去写了,因为比较方便使用vue lazyload进行处理,高效率开发 一. vue lazyload插件: 插件地址:http ...

  9. Vue图片懒加载插件 - vue lazyload的简单使用

    Vue module for lazyloading images in your applications. Some of goals of this project worth noting i ...

随机推荐

  1. linux学习:归档,备份及进程相关命令用法整理

    指令:tar.zip.gzip.unzip.rsync.scp.ps.kill.nohup 压缩 tar 归档命令,不具备压缩功能 tar -zcvf test.tar.gz  test/     # ...

  2. python mysql 单表查询 多表查询

    一.外键 变种: 三种关系: 多对一 站在左表的角度: (1)一个员工 能不能在 多个部门? 不成立 (2)多个员工 能不能在 一个部门? 成立 只要有一个条件成立:多 对 一或者是1对多 如果两个条 ...

  3. OO第三次博客作业

    一.规格化的发展历史 最早的程序设计都是面向机器,从一开始使用的机器语言,到后面的汇编语言,都是面向机器的语言,编写困难也容易出错.随着需求的发展,程序的编写从面向机器走向面向过程,但由于goto语句 ...

  4. dtNavMeshQuery::findLocalNeighbourhood m_tinyNodePool->getNode dtHashRef整数哈希 getPortalPoints dtOverlapPolyPoly2D

    dtNavMeshQuery::findLocalNeighbourhood(dtPolyRef startRef, const float* centerPos, const float radiu ...

  5. 安装Office2010出现MSXML版本6.10.1129.0错误

      在键盘上按“win+R”组合键出现图图示界面后,输入“regsvr32 /u msxml6.dll”,点击“确定”. 出现图示显示后,点击“确定”,并同时去试试office是否能够安装了. 如果上 ...

  6. std unorder_map insert 和 emplace的区别

    std::unordered_map<int, int > map; map.insert(std::make_pair(, )); map.insert(std::make_pair(, ...

  7. HANA SQL备忘录

    1.改变元素列类型 ALTER TABLE <TABLE_NAME> ALTER (<COLUMN_NAME> <COLUMN_TYPE>);

  8. spark-sql分组去重总数统计uv

    SparkConf sparkConf = new SparkConf(); sparkConf .setAppName("Internal_Func") .setMaster(& ...

  9. SoupUI 5.1.2(专业版)下载(含破解文件)

    包内含原安装包和破解文件,仅用于技术交流,切勿用于商业用途. 安装教程参考:https://www.cnblogs.com/miaojjblog/p/9778839.html 安装包及破解文件下载地址 ...

  10. 我喜欢的几款不错的vim插件

    插件安装组件 https://github.com/tpope/vim-pathogen supertab自动补齐 https://www.vim.org/scripts/script.php?scr ...