下拉刷新：就是將數(shù)據(jù)清空 重新請求數(shù)據(jù) 配合onPullDownRefresh
上拉加載更多 重新請求數(shù)據(jù) 添加到list? 配合onReachBottom
首先 json 頁面要配置 "enablePullDownRefresh":true ,"backgroundTextStyle":"dark"
下拉刷新
wx.showNavigationBarLoading();
this.setData({
然后初始searchParam
isShowloading: true, //下拉刷新顯示了loading
isEmpty:false, //表示數(shù)據(jù)暫時沒有請求完
list:[]
},()=>{this.getList()})
獲取數(shù)據(jù)的時候 判斷l(xiāng)ist.length,選擇整合數(shù)據(jù)還是賦值
isEmpty:res.data.data.length<this.data.searchParam.per_page?true:false
請求完成后的回調(diào)里判斷是否是下拉刷新
?if (this.data.isShowloading) {
? ? ? ? ? wx.hideNavigationBarLoading() //完成停止加載
? ? ? ? ? wx.stopPullDownRefresh() //停止下拉刷新
? ? ? ? ? this.setData({
? ? ? ? ? ? isShowloading: false
? ? ? ? ? })
? ? ? ? }
上拉加載更多
if(!this.data.isEmpty){
? ? ? this.setData({
? ? ? ? searchParam: { ...this.data.searchParam,
? ? ? ? ? current_page:this.data.searchParam.current_page+1
? ? ? ? }
? ? ? }, () => this.getList())
? ? }
頁面中有個 用于加載完數(shù)據(jù)后的顯示
<view class="empty-tip" wx:if="{{isEmpty}}">
? <text>沒有更多了~</text>
? ? ? ?</view>
