load-more-dbx v1.0.1

瀑布流插件

后端如果一次性传递成千上万条数据，使用滚动事件进行加载，就可以在这个产品组件的外边套用LoadMore插件

作者：小兴兴

一、安装

使用 npm 进行安装

npm install load-more-dbx -S

或使用yarn进行安装

yarn add load-more-dbx

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

import LoadMore from 'load-more-dbx'
Vue use(LoadMore)

三、在组件中使用

找到产品列表的外层，原本是一次性渲染的写法

<Products :arr="allProducts" /> 

现在可以改为：

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

注意：参数解释：

• allProducts：代表的是请求的全部商品列表；
• bigarr： 代表的是传递给插件的数据；
• smallarr： 代表的是插件返回每次渲染多少条数据的新数组；
• size: 要渲染的条数

四、参数传递

只需要给插件传递 bigarr 和 size即可