onPullDownRefresh 处理函数(和onLoad等生命周期函数同级),监听该页面用户下拉刷新事件。
uni.startPullDownRefresh(OBJECT)
- 需要在 pages.json 里,找到的当前页面的pages节点,并在 style 选项中开启 enablePullDownRefresh。
{ "path" : "pages/home/home", "style" : { "navigationBarTitleText": "百香果乐园-首页", "enablePullDownRefresh":true } }
- 在需要刷新的页面调用该方法,代码如下
onPullDownRefresh(){
console.log('下拉刷新')
request({
url:'/pro'
}).then(res=>{
this.prolist=res.data.data
this.pageCode=1//重置页码
this.flag=false//有无数据标识
// 结束刷新
uni.stopPullDownRefresh()
})
},
注意:当处理完数据刷新后,uni.stopPullDownRefresh 可以停止当前页面的下拉刷新。
onReachBottom 处理函数(和onLoad等生命周期函数同级),监听该页面用户上拉加载事件。
onReachBottom(OBJECT)
代码如下:
onReachBottom () {
console.log('s上拉加载')
request({
url:'/pro',
data:{
pageCode:this.pageCode,
limtNum:10
}
}).then(res=>{
this.pageCode++
if(res.data.code === '10000'){
this.flag=true
}else {
this.prolist=[...this.prolist,...res.data.data]
}
})
},
注意:在成功的回调函数中this.pageCode++
页面数需要加1,并且this.prolist=[...this.prolist,...res.data.data]
获取的数据要重新的合并且展示在当前页面