滚动加载:vue-infinite-scroll使用

  • 安装
npm install vue-infinite-scroll --save
  • main.js引用
import infiniteScroll from 'vue-infinite-scroll'
Vue.use(infiniteScroll)
  • 使用


  • 配置
    v-infinite-scroll="loadMore"表示回调函数是loadMore
    infinite-scroll-disabled="busy"表示由变量busy决定是否执行loadMore
    false则执行loadMore
    true则不执行,看清楚,
    busy表示繁忙,繁忙的时候是不执行的。
    infinite-scroll-distance="10"这里10决定了页面滚动到离页尾多少像素的时候触发回调函数,10是像素值。
    通常我们会在页尾做一个几十像素高的“正在加载中...”,这样的话,可以把这个div的高度设为infinite-scroll-distance的值即可。

你可能感兴趣的:(滚动加载:vue-infinite-scroll使用)