uniapp 下拉刷新、上拉加载更多、最常见的节流场景
首先在pages.josn文件内的pages数组中找到你向加下拉刷新的页面。找到后添加:{"path": "pages/equipment/equipment","style": {"navigationBarTitleText": "设备","enablePullDownRefresh": true, //开启下拉刷新"onReachBottomDistance": 50//开始上拉加载更多,设
·
首先在pages.josn文件内的pages数组中找到你向加下拉刷新的页面。
找到后添加:
{
"path": "pages/equipment/equipment",
"style": {
"navigationBarTitleText": "设备",
"enablePullDownRefresh": true, //开启下拉刷新
"onReachBottomDistance": 50
//开始上拉加载更多,设置底部的触发距离,现在属性值是50就是距离底部50px时触发上拉回调
}
在设备页面与data平级添加函数如下:
onPullDownRefresh() {
//下拉刷新
uni.$u.toast("去调用接口,完成刷新操作")
//调用接口完成后添加下方函数,停止当前页面下拉刷新。
uni.stopPullDownRefresh()
},
onReachBottom() {
//这是上拉触发的函数.一般在这里进行分页操作.
/*会有一种情况就是当数据已经全部加载完成了,再次触底还会调用接口,
这时就需要去记录一下是否已经全部加载完毕,加载完毕就不去请求接口了.
这时最常见的节流场景*/
},
更多推荐
已为社区贡献7条内容
所有评论(0)