vue中使用图片懒加载--vue-lazyload 插件

在vue中使用图片懒加载详细指南

说明

当网络请求比较慢的时候,提前给这张图片添加一个像素比较低的占位图片，不至于堆叠在一块，或显示大片空白，让用户体验更好一点。

使用方式

使用vue的 vue-lazyload 插件 插件地址
1.Installation 安装方式

npm install vue-lazyload -d

2.用法
在main.js 入口文件

import VueLazyLoad from 'vue-lazyload'//导入

Vue.use(VueLazyLoad, {
  preLoad: 1,
  loading: require('assets/img/common/placeholder.png')//使用,地址图片为预加载图片
})

在入口文件添加后，在组件任何地方都可以直接使用把 img 里的:src ->
**v-lazy=""**如:

    <img v-lazy="getImg" :key="getImg" alt="">