Vue实现下拉滚动加载数据的示例

web项目经常会用到下拉滚动加载数据的功能，今天就来种草 vue-infinite-loading 这个插件，讲解一下使用方法！

第一步：安装

第二步：引用

第三步：使用

1.基本用法

2.分页用法

说明： $state: 该组件会传递一个特殊的事件参数$state给事件处理器来改变加载状态，$state参数包括三个方法，它们是loaded方法，complete方法和reset方法。

• loaded方法用于在每次加载数据后停止播放动画，然后该组件将准备好进行下一次触发。
• complete方法用于完成完整的无限加载，则该组件将不再处理任何滚动操作。如果在loaded调用complete方法时永远不会调用该方法，则此组件将显示用户的结果消息，如果不是，则将显示不再有用户消息，并且可以按slot设置其它内容
• reset方法是将组件返回到原来的状态
  

3.条件用法

官方链接：

github链接：https://github.com/peachscript/vue-infinite-loading

以上就是vue实现下拉滚动加载数据的示例的详细内容，更多关于vue下拉滚动加载数据的资料请关注其它相关文章！