其他分享
首页 > 其他分享> > uni-app之onReachBottom(上拉触底事件)

uni-app之onReachBottom(上拉触底事件)

作者:互联网

背景

要实现功能,用列表上拉加载数据。

 之前,用了滚动区域scroll-view以及它的监听事件@scrolltolower(https://www.cnblogs.com/luyj00436/p/15038958.html)。结果发现方法不是很恰当。主要原因是:区域滚动的性能不如页面的周期函数onReachBottom。

函数名 说明
onReachBottom 页面滚动到底部的事件(不是scroll-view滚到底),常用于下拉下一页数据。

实现

页面中添加onReachBottom下拉触底事件。

 1 export
 2 default {
 3         // ……
 4         onReachBottom:
 5         function() {
 6             console.log("加载数据的方法");
 7         },
 8         //……
 9     },
10     

  使用注意 可在pages.json里定义具体页面底部的触发距离,例如50px。

1 // ……
2 {
3     "path": "pages/login/login",
4     "style": {
5         "navigationBarTitleText": "标题名",
6         "onReachBottomDistance": 50 // 上拉触底的单位,单位为px
7     }
8 },
9 // ……

标签:滚动,触底,app,onReachBottom,上拉,uni,pages,页面
来源: https://www.cnblogs.com/luyj00436/p/15039434.html