微信小程序实现下拉刷新功能

1.json文件配置属性enablePullDownRefresh

1    {
2 　　　　"enablePullDownRefresh": true
3 　　}

2.js中调用刷新函数

 1    /**
 2    * 获取数据
 3    */
 4   getlist() {
 5     //业务逻辑...(省略)
 6     
 7     //隐藏loading 提示框
 8     wx.hideLoading();
 9     //隐藏导航条加载动画
10     wx.hideNavigationBarLoading();
11     //停止下拉刷新
12     wx.stopPullDownRefresh();
13   },
14 
15    /**
16    * 刷新
17    */
18   onRefresh:function(){
19     //导航条加载动画
20     wx.showNavigationBarLoading()
21     //loading 提示框
22     wx.showLoading({
23       title: 'Loading...',
24     })
25     this.getlist();
26   },
27 
28   /**
29    * 页面相关事件处理函数--监听用户下拉动作
30    */
31   onPullDownRefresh: function () {
32     this.onRefresh();
33   }

最终结果：

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 钉钉小程序—实现下拉刷新功能微信小程序实现下拉刷新在微信小程序中，如何实现下拉刷新（模拟刷新）微信小程序开发之下拉刷新，上拉加载更多微信小程序开发——微信小程序下拉刷新真机无法弹回微信小程序组件下拉刷新微信小程序 - 关于下拉刷新微信小程序之下拉刷新微信小程序~下拉刷新PullDownRefresh 微信小程序实现列表下拉刷新上拉加载