这篇文章主要介绍“小程序怎么实现上拉刷新下拉加载”，在日常操作中，相信很多人在小程序怎么实现上拉刷新下拉加载问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”小程序怎么实现上拉刷新下拉加载”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！
上拉刷新，下拉加载，分别点击tab都还能够请求服务器。我想的最好的方法是把日期和月份这2个抽离出来做成一个方法，然后上拉刷新，下拉加载，点击tab分别调用日期和月份方法即可。我尝试百度/google，见到最多的链式写法，以获取用户数据举例：
//这里的操作都是举例说明。
wxLogin()
.then(=>res{
console.log(res.code)
return wxRequest.getUserOpenId(url, params)//请求获取用户ID
})
.then(=>res{
console.log(res.openId)
return wxRequest.getUserPhone());//请求获取用户手机
})
.catch()
在index.js页面 ; getUserOpenId()和getUserPhone()都是封装在另外一个js里面的。或者是直接getUserMessage().then(res=>).catch();这样直接获取用户数据了。
wxRequest.getUserMessage()
.then(=>res{
console.log(res.code);
})
.catch()
当然我这样举例还是不能说明存在什么问题，那么如果我要像上面图那样获取日期数据，月份数据怎么办呢?难道按照第一个那样写，上拉加载那里写一堆，下拉刷新那里一堆，切换tab也写一堆重复的代码?还是说我管你是上拉刷新，还是下拉加载好，我直接通过一个接口在一起获取数据?所以我通过百度/google到他们写的还不够完善(不是写的不好哈)
我的写法：
//我只是抽取我部分代码来展示
Page({
data:{
},
onLoad: function () {//生命周期
this.readUserMesage();
},
readUserMesage(): function () {//获取用户信息，并获取按日期的数据
this.showLoading();
let parameters = 'user?ptId=aaaaaaaaaaaaaa';
api.getRequest({
parameters: parameters,
}).then(res => {
return this.readDayData(); //获取日期信息
}).catch(error => {
this.hideLoading();
});
},
readMonthData() {//把月份单独抽取出来
var url = 'dailypay?xxxxx=aaaa&yyy=bbbbbb';
var parameters = { parameters: url }
return api.getRequest(parameters)//我这里是封装请求服务器的，注意我加了return
.then(res => {
//这里就可以获取到返回的res的集合数据
}).catch(error => {
console.log(JSON.stringify(error));
this.hideLoading();
});
},
readDayData() {//把日期单独抽取出来
var url = 'dailypay?xxxxx=aaaa&yyy=bbbbbb';
var parameters = { parameters: url }
return api.getRequest(parameters)//我这里是封装请求服务器的，注意我加了return
.then(res => {
//这里就可以获取到返回的res的集合数据
}).catch(error => {
this.hideLoading();
});
},
onPullDownRefresh() {//下拉刷新
if (this.data.currentIndex == 0) {//如果当前是在日期
this.readDayData();
} else {//如果当前是在月份
this.readMonthData();
}
},
onReachBottom() {//上拉加载
if (this.data.currentIndex == 0) {
this.readDayData();
} else {
this.readMonthData();
}
},
)}
到此，关于“小程序怎么实现上拉刷新下拉加载”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注亿速云网站，小编会继续努力为大家带来更多实用的文章！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
