图片懒加载——vue-lazyload

什么是图片懒加载

---

当页面用到该图片时再加载该图片

使用vue-lazyload

---

1. 安装

   npm install vue-lazyload --save

2. 导入（在main.js文件中导入）

   import VueLazyLoad from "vue-lazyload";

3. Vue.use（main.js）

   Vue.use(VueLazyLoad);

4. 修改img:src-> v-lazy
   
   如上图，将img标签的src属性替换为v-lazy

5. 根据需求添加选项，例如：添加占位图

当页面图片还未加载完成时，显示占位图
更多选项请参考：vue-lazyload