vue图片懒加载
vue做的项目，图片较多，都是直接引入的，每次打开主页加载比较慢。
请求总共10.7M，只是图片就占了差不多9M，完成时间花了37秒，估计老板看到这个速度弄死我的想法都有了。
这是后我们可以使用图片懒加载的方式，和以前Jquery图片懒加载的效果是一样的，当你需要展示这张图片的时候，才去请求它，加载出来，这样效率会高很多。
这里vue用的懒加载是：vue-lazyload
GitHub地址：https://github.com/hilongjw/vue-lazyload
命令：
cnpm install vue-lazyload
引入：
import VueLazyload from 'vue-lazyload'
在main.js中全局使用:
Vue.use(VueLazyload, {
preLoad: 1, //预加载高度的比例
error: 'http://cdn.uehtml.com/201402/1392662591495_1140x0.gif', //图像的src加载失败
loading: 'http://cdn.uehtml.com/201402/1392662591495_1140x0.gif', //src的图像加载
attempt: 1, //尝试计数
listenEvents: [ 'scroll', 'mousewheel' ] //你想要监听的事件,我个人喜欢全部监听，方便
});
页面当中的写法：
<img src="" v-lazy="Img1" /> //src空着即可，不用写
在data（）中将图片地址引入：
Img1:'../../static/images/20170903234241.jpg'
最后需要注意图片存放路径，static文件夹下面才是最安全的。
这是最终的效果，加载了8M，和之前相比相差2M，但是时间缩小很多。