关于vue.js:vuelazyload的使用

vue-lazyload说白了，我没下滑到那行就不显示也加载不到那些图

第一步：装置

cnpm i vue-lazyload -S

第二步：引入

在main.js里引入

import VueLazyLoad from 'vue-lazyload'Vue.use(VueLazyLoad, {  preLoad: 1,//加载1秒  error: require('./assets/logo.png'),//加载不到用这图  loading: require('./assets/y.png'),//加载中用这个图  attempt: 1//提早用1秒})

第三步：应用

---在img标签中应用

<ul class="img">   <li v-for="(item, index) in imgList">      <img v-lazy="item" />   </li></ul>

---在背景图上应用

<ul class="bgImg"\>       <li v-for="(item,index) in imgList"        v-lazy:background-image="item">   </li></ul>

残缺代码

<template>    <div id="app">        <ul class="img">            <li v-for="(item, index) in imgList">                <img v-lazy="item" />            </li>        </ul>    </div></template><script>export default {   data() {      return {         imgList: [             require('./assets/img/1.jpg'),                         //至             require('./assets/img/20.jpg')]        };    }};</script>