Welcome to lh-loadmore 👋

> This is a vue loadmore tool

$3

Example

Explain

避免数据一次性加载，分页加载，提升加载数据速度。

Install

sh

yarn add lh-loadmore --save (推荐)



cnpm i lh-loadmore --save



npm i lh-loadmore --save













Usage








全局引用

sh

main.js

  import LhLoadMore from 'lh-loadmore'

  Vue.use(LhLoadMore)





组件使用

1. 一般使用方法 Tips

sh





2. 参数



参数 | 说明 | 类型

:- | :- | :- |

loadlist | 数据展示列表 | Array

loadmoregif | 加载动画的gif & 数据加载完的图标 | String

loadmoretxt | 加载动画内容 | String

setscrollbtm | 设置触底距离 | Number

pagestar | 设置开始页码 | Number

pagelist | 设置每页加载条数 | Number



3. 事件



事件名称 | 说明 | 设置数据

:- | :- | :- |

created | 父组件生命周期初始化数据 | 数据总条数 & 初始化数据数组 & 变更后的页码开始值

nextpage | 加载下一页数据 | 向子组件传递新一页数据 & 传递页码开始值(子组件判断是否数据加载完)

pageNone | 数据已加载完 | 向子组件传递加载结束图标 & 传递加载结束文字











注意



* css采用

stylus进行开发，如果您没有安装对应依赖，我们在您安装我们插件的时候，自动帮您安装对应stylus

依赖。

* 必须在

created

 函数中初始化您需要渲染的数据，这涉及到父子组件的生命周期执行顺序关系。

* 您的对应加载动画gif及结束动画图片，请在父组件使用

require

 动态引入。

* 关于插件布局，我们使用适合我们自己的布局渲染，如果不适合您，请修改

node_modules相关代码包`。

Author

👤 OUSANPANG

* Github: @LOUSANPANG

🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

Show your support

Give a ⭐️ if this project helped you!

📝 License