使用vue-infinite-scroll实现无限滚动

今天在移动端项目中遇见一个需求，需要数据无限滚动。在这里总结一下使用心得

首先引入：

 npm install vue-infinite-scroll --save  

在vue中的main.js中引入：

import infiniteScroll from 'vue-infinite-scroll'
Vue.use(infiniteScroll)

 

在代码中使用：

<template>
<section>
    <div class="wrap"
    v-infinite-scroll="loadMore"
    :infinite-scroll-disabled="loading"
    infinite-scroll-distance="20"
    >
    <div v-for="(item, index) in list" :key="index" class="div">
        <li>{
  {item.text}}</li>
    </div>
    </div>
    <section  v-show="loadingTip">
          <span>加载中···</span>
    &l