load-more-gg v1.0.3

瀑布流插件

后端如果一次性返回成千上万条数据，那么可以在产品组件的外层套用这个LoadMore插件。

一、安装

npm i load-more-gg  -S

或

yarn add load-more-gg

二、vue项目入口文件调用

在vue项目中入口文件main.js写入以下代码：

import LoadMore from 'load-more-gg'

Vue.use(LoadMore)

三、组件使用

找到产品列表组件的外层，原本如果是这种一次性渲染的写法：

<Products :arr="goodsList" />

现在可以改写为：

 <LoadMore :bigarr="goodsList" :size="8">
     <Products slot-scope="scope" :arr="scope.smallarr" />
 </LoadMore>

四、参数注释

• bigarr：代表你要渲染的总数据
• size：代表每次滚动要加载多少项
• smallarr：代表每次返回出来的新数组

重点：在调用时只需修改组件上的bigarr和size即可