今天在实现小程序下拉加载更多功能的时候遇到了一个bug
刚开始一直想通过小程序的onReachButtom实现触底调用getGoodsList方法实现下拉加载更多,但onReachButtom函数总是不触发
onReachButtom(){
this.getGoodsList()
}
上网找了各种解决办法都没有解决,在main.json中加‘enablePullDounRefresh:true’这些都不能解决(enablePullDounRefresh:true是下拉刷新,不是下拉刷新...)
最后在小程序官方文档中看到,scroll-view这个组件中有scrolltolower事件
(距离底部/右边多远时,触发scrolltolower事件)
所以我将商品列表放在scroll-view这个组件中实现(记得给scroll-view一个高度),scroll-view内部触及底部的时候触发scrolltolower事件,在scrolltolower事件函数中调用 this.getGoodsList()方法实现页面局部数据懒加载
handleScrollToButtom(){
this.getGoodsList()
}
成功实现页面局部数据懒加载
so问题应该是onReachButtom是针对整个页面到达底部时触发,而我的goodslist是一个绝对定位定位在页面上的,我也没有给page一个固定的高度,我在goodslist上做滑动的时候,相对于页面来说,并没有触发到底部。