博客
关于我
图片懒加载
阅读量:623 次
发布时间:2019-03-14

本文共 403 字,大约阅读时间需要 1 分钟。

为什么需要图片懒加载

  • 简而言之就是为了提高前端性能。
  • 图片在需要的时候才加载,减轻服务的负担,提高页面的加载速度,提高用户体验。

图片懒加载的使用

①npm安装

npm install vue-lazyload -S

②安装图片懒加载插件

// main.jsimport VueLazyLoad from 'vue-lazyload'import Vue from 'vue'// 安装图片懒加载插件Vue.use(VueLazyLoad, {  // 选择传入的配置  //loading:图片在加载中时  loading: require('./assets/img/common/图片3.png')  //error:图片加载失败时  error: require('./assets/img/common/图片4.png')})

③修改需要懒加载的图片img :src -> img v-lazy

转载地址:http://lexoz.baihongyu.com/

你可能感兴趣的文章
SpringBoot使用RedisTemplate简单操作Redis的五种数据类型
查看>>
Thymeleaf sec:authorize 标签不生效
查看>>
微信JS-SDK DEMO页面和示例代码
查看>>
一张图搞定RPC框架核心原理
查看>>
他来了他来了,他带着云栖大会的免费门票走来了
查看>>
获取linux 主机cpu类型
查看>>
pwntools编写技巧
查看>>
How2Heap笔记(三)
查看>>
测试tensorflow是否安装成功 出现 SyntaxError: invalid syntax的错误
查看>>
算法训练 未名湖边的烦恼(递归,递推)
查看>>
什么是接口
查看>>
Allegro中如何消除器件本身Pin间距报错
查看>>
Flask--简介
查看>>
16 python基础-恺撒密码
查看>>
Frame--Api框架
查看>>
Boostrap技能点整理之【网格系统】
查看>>
javaWeb服务详解(含源代码,测试通过,注释) ——Emp的Dao层
查看>>
ssm(Spring+Spring mvc+mybatis)——updateDept.jsp
查看>>
Git简单理解与使用
查看>>
echarts 基本图表开发小结
查看>>