vue-lazyload 使用的基本介绍

1.npm安装

$ npm i vue-lazyload -S

2.在vue项目中的使用

// main.js:
import VueLazyload from 'vue-lazyload'
 
Vue.use(VueLazyload)
 
// or with options
Vue.use(VueLazyload, {
  preLoad: 1.3,
  error: 'dist/error.png',
  loading: 'dist/loading.gif',
  attempt: 1,
  // the default is ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend']
  listenEvents: [ 'scroll' ]
})

// template:
<ul>
  <li v-for="img in list">
    <img v-lazy="img.src" >
  </li>
</ul>

3.参数说明

4. loading svg照片

链接:https://pan.baidu.com/s/1twKyQFztVU4627_8kCvaZw 
提取码:dqwa

评论