一分钟教你学会微信小程序的页面刷新

一分钟教你学会微信小程序的页面刷新

微信开放文档下拉刷新

1. 开始刷新

1.在页面的json文件中设置是否开启刷新

2.页面的js中的onPullDownRefresh方法中

// 监听用户的下拉刷新
onPullDownRefresh(){// 1.重置数组this.setData({list1:[],list2:[],list3:[]})//2.重置页码// this.QueryParams.pagenum=1// 3.加载数据this.getlunbao();this.getteam();this.getfanzhi();this.getAdmin();
},

3.在获取请求的方法中关闭页面加载

 wx.stopPullDownRefresh({})

2.刷新界面的提示

在请求数据库的方法中加入这个提示

getShop(){ //构造的请求数据库的方法wx.showLoading({title: '加载中....',})//请求数据库wx.cloud.database().collection('electric').get().then(res=>{wx.hideLoading()//停止数据刷新wx.stopPullDownRefresh()this.setData({list:res.data})}).catch(res=>{console.log('失败')})},

3.结束刷新

wx.stopPullDownRefresh()
在数据库请求到数据后开始隐藏刷新提示，并且结束刷新。

 .then(res=>{wx.hideLoading()//停止数据刷新wx.stopPullDownRefresh()this.setData({list:res.data})})

4.下拉刷新监听

onPullDownRefresh: function () {this.getShop()//请求数据库的方法this.getShiwu()
},

5.下拉刷新的样式设计

代码写在这里

代码实现

{"usingComponents": {},"enablePullDownRefresh": true,"backgroundColor": "#d3d3d3"
}

6.总结
下拉刷新主要是调用API接口，通过wx.startPullDownRefresh()和wx.stopPullDownRefresh()方法来实现下拉刷新的功能。
**

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！