本文共 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