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

安装

npm i vue-infinite-scroll -D

引入

有两种方式，一个是全局，一个是在单个组件中引入，我采用的是后者

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

//单个组件
import infiniteScroll from 'vue-infinite-scroll'
export default {
	directives: { infiniteScroll }
}

使用

	
  

  
暂无数据

1. busy的值为true就不再加载，为false时持续加载
2. infinite-scroll-distance=“10” 表示距离底部10时就触发loadMore方法
3. 在getList方法中传入一个参数flag，判断是否拼接函数，
4. fetchList是封装的axios get请求，项目采用后台分页，listQuery是分页参数，其中currentPage（从0开始）代表当前页数；pageSize代表一页显示条数