1. 下拉刷新
下拉刷新主要用到「onPullDownRefresh」函数，我们在新建目录然后新建page之后在wxml文件中会自动生成很多生命周期函数，其中就会生成「onPullDownRefresh」函数，所以没注意的同学会发现我写了「onPullDownRefresh」函数，但是没起作用的情况
当然我们最先要做的是开启此功能，在「app.json」文件「window」对象中加入
"enablePullDownRefresh": true或者在页面对应的JSON文件中加入这个配置，例如我「list」目录下wxml对应的JSON文件就是「list.json」或者「index,json」
可以通过「wx.startPullDownRefresh」触发下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一样
当处理完数据刷新后，「wx.stopPullDownRefresh」可以停止当前页面的刷新
最后使用方法如下：
getData: function() {
wx.cloud.callFunction({
name: '', data: {
type: 'get'
}, success: function(res) {
.......
// 停止下拉动作
wx.stopPullDownRefresh();
}, fail: function() {
}
})
}
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
this.getData(); // 这里写自己要调用的查询方法
},
PS: 如果大家看不到动画，在「app.json」「window」对象中添加如下：
"backgroundTextStyle": "dark"
2. 上拉触底-加载更多数据
上拉触底用到「onReachBottom」函数，直接上代码：
/**
* 上拉触底
*/
onReachBottom: function () {
this.setData({
curPage: this.data.curPage+1 // 一般上拉触底是为了加载更多分页数据，所以这里页数自增
});
this.getGoodsList(this.data.activeCategoryId,true) // 查询方法
},
可以在「app.json」中的「window」对象下设置触发距离：
"onReachBottomDistance":50在触发距离内滑动期间，本事件只会触发一次
小程序，附带源码，相互学习
定制属于你自己的婚礼邀请函，源码，扫描直接体验
私人影剧院，电影观影指南，源码，扫码直接体验
需要入群交流的，可以加我微信： bjawenfd ，纯粹交流群互粉群
原文地址：https://blog.csdn.net/lwzhang1101
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。