原理：先将img标签的src链接设为同一张图片（比如空白图片），然后给img标签设置自定义属性（比如 data-src）,然后将真正的图片地址存储在data-src中，当JS监听到该图片元素进入可视窗口时，将自定义属性中的地址存储到src属性中。达到懒加载的效果，这样做能防止页面一次性向服务器发送大量请求，导致服务器响应面，页面卡顿崩溃等。
目录
第一步:安装lazyload
第二步:main.js导入lazyload
第三步:页面使用lazyload,将src改为v-lazy
第四步:修改加载图片的样式
第一步:安装lazyload
npm i vue-lazyload -S
第二步:main.js导入lazyload
import VueLazyload from 'vue-lazyload'Vue.use(VueLazyload, {loading: require('assets/images/lazy.png'),error: require('assets/images/error.png'),})
第三步:页面使用lazyload,将src改为v-lazy
<img v-lazy="item.image" />
第四步:修改加载图片的样式
img[lazy=loading]{transform:scaleX(0.3) scaleY(0.5);}img[lazy=loaded]{animation:appear 0.3s; //加载的图片显示的动画animation-fill-mode: both;}@keyframes appear {from{opacity:0;}to{opacity:1;}}
