小程序中分頁加載問題


別的不說,直接貼分頁加載的代碼,看注釋就好

 pasting

//index.js
const app = getApp()

//分裝的require 函數,http.js見本人隨筆“解決小程序分裝的require問題

var http = require( '../../../service/http.js');
Page({
data: {
newsBulletin: [],
page: 1,
pageSize: 8,
hasMoreData: true,
},
/**
* 生命周期函數--監聽頁面加載
*/
onLoad: function () {
var that = this;
if (!wx.cloud) {
wx.redirectTo({
url: '../../chooseLib/chooseLib',
})
return
}
// 頁面初始化 options為頁面跳轉所帶來的參數\

//初始化加載一次 

that.getNewsBulletin( '正在加載數據...')
},
// 新聞公告
getNewsBulletin: function () {
var that = this;
http.getReq( "/api5/News?option=hot&" + "page=" + that.data.page + "&size="+that.data.pageSize,{}, function (res) {
if (that.data.page == 1) {
var newsBulletinTem = [];
} else{
var newsBulletinTem = that.data.newsBulletin;
}
var newsBulletin = res.data;
newsBulletinTem = newsBulletinTem.concat(newsBulletin); //使用concat時一定要提前聲明newsBulletinTem
//如果新加載出來的數據的長度小於需要請求的數據長度,證明數據已經下載完畢,hasMoreData設為false,否則頁數加一

if (newsBulletin.length < that.data.pageSize) {

that.setData({
newsBulletin: newsBulletinTem,
hasMoreData: false
})
} else {
that.setData({
newsBulletin: newsBulletinTem,
hasMoreData: true,
page: that.data.page + 1
})
}
})
},
/**
* 頁面相關事件處理函數--監聽用戶下拉動作
*/
onPullDownRefresh: function () {
this.data.page = 1
this.getNewsBulletin( '正在刷新數據')
},

/**
* 頁面上拉觸底事件的處理函數
*/
onReachBottom: function () {
if ( this.data.hasMoreData) {
this.getNewsBulletin( '加載更多數據')
} else {
wx.showToast({
title: '沒有更多數據',
})
}
}
})

注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com