vue-lazyload实现图片懒加载

为了效果清晰，我加了个loading图

文档链接
安装

npm i vue-lazyload -S

main.js全局引入

import VueLazyLoad from 'vue-lazyload'
Vue.use(VueLazyLoad, {
  preLoad: 1.3,
  error: '', //错误图占位
  loading: '',//加载图占位
  attempt: 1,
  throttleWait: 300 //延迟图片加载时间
})

图片懒加载

 <img v-lazy="item.imgurl" alt />

背景图懒加载

 <div v-lazy:background-image="item.imgurl"></div>