uniapp开发微信小程序笔记10-触底加载

前言：

触底加载需求描述：

经常在做一些商品列表页的时候，如果一次性加载大量数据会影响性能，一般都是先加载10-20条，等用户向下滑到底部时再加载新的数据并渲染上去。

1、官方提供了一个API：onReachBottom

来处理页面滚动到底部的事件，可以看到官方文档中把这个事件归在页面生命周期里，所以可以按照页面生命周期的方式写代码

onReachBottom(){
    console.log('触底了！')
}

可在pages.json里定义具体页面底部的触发距离onReachBottomDistance，

比如设为50，那么滚动页面到距离底部50px时，就会触发onReachBottom事件。

2、如果是用的scroll-view渲染

可以用scrolltolower来触发滚动到底部的事件

属性名	类型	说明
@scrolltoupper	EventHandle	滚动到顶部/左边，会触发 scrolltoupper 事件
@scrolltolower	EventHandle	滚动到底部/右边，会触发 scrolltolower 事件