我是做前端開發的周先生，有一段時間，一直在做這個功能，然后自己學習上有點心得，趁此我想把這個功能給分享出來，如果有需要，轉載時，請附上該文章鏈接，謝謝@_@!!!!
以下以小程序為例子
一、自定義屬性 data
newsList:[ ], //內容
newsTotal:0,//總數量
pageIndex:1, //頁碼
pageSize:10, //一頁顯示多少條數據
isMore:true //是否顯示更多數據
二、方法 methods
async getNewsList(init){
if(init){
this.pageIndex = 1
this.more = true
}
wx.showNavigationBarLoading()
const res = await util.post('/api/content/getunreviewedcontent',{
page_index:this.pageIndex,
page_size:this.pageSize
})
if (res.list.length < this.pageSize && this.pageIndex > 1) {
this.isMore = false
}
if(init){
this.newsList = res.list
wx.stopPullDownRefresh()
}else{
// 下拉刷新，不能直接覆蓋，而是累加
this.newsList = this.newsList.concat(res.list)
}
wx.hideNavigationBarLoading()
},
三、功能
//上拉加載
onReachBottom () {
if (!this.isMore ) {
// 沒有更多了
return false
}
if(Math.ceil(this.newsTotal/this.pageSize)>this.pageIndex){
this.pageIndex++
this.getNewsList()
}
},
//下拉刷新
onPullDownRefresh(){
this.getNewsList(true)
},
//頁面初始化
mounted(){
this.getNewsList(true)
}