vue 图片懒加载lazyload

   记录一下，写文章的快乐就是从别人那搬过来，不用担心别人删掉，节约筛选时间，用到的时候不用到处找，直接进自己的文章里就有，O(∩_∩)O哈哈~

  自己写的大概只有自己最懂系列。。。

官网官网 vue-lazyload - npm

实际项目代码

1、安装插件 

npm install vue-lazyload --save

 2、main.js简单的引用。

import VueLazyload from 'vue-lazyload'

Vue.use(VueLazyload,{
  loading: require('@/assets/loading.gif'), 
  attempt: 3
}) 

//也可以不配置，直接写Vue.use(VueLazyload)

3、使用

1、图片懒加载
<ul>
  <li v-for="img in list">
    <img v-lazy="img.src" >
  </li>
</ul>

2、背景图片懒加载
<div v-lazy:background-image="imgLink"></div>