微信小程序如何实现下拉刷新界面-创新互联

这篇文章主要介绍微信小程序如何实现下拉刷新界面，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

十载的莱西网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。成都全网营销的优势是能够根据用户设备显示端的尺寸不同，自动调整莱西建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联从事“莱西网站设计”,“莱西网站推广”以来，每个客户项目都认真落实执行。

微信小程序下拉刷新界面的实现

利用onPullDownRefresh函数设置下拉刷新功能

一、在app.json中，将window选项中的enablePullDownRefresh设为true

"window":{ 
   "enablePullDownRefresh":true 
}

      或者在要刷新的界面的XXX.json中设置enablePullDownRefresh设为true  

{ 
  "enablePullDownRefresh": true 
}

二、利用onPullDownRefresh函数定义下拉动作并结合wx.request()向后台请求数据更新

// 下拉刷新 
onPullDownRefresh:function(){ 
 // 动态设置导航条标题 
 wx.setNavigationBarTitle({ 
  title: '' 
 }); 
 wx.showNavigationBarLoading(); //在标题栏中显示加载图标 
 
 let url = app.globalConfig.pre_api + "/api/user/getUserInfo.php";//根据实际情况定义请求的路径 
 let user_id = app.globalData.user_id;              //请求的参数 
 let flag = true; 
 let that = this; 
 // 验证参数合法性 
 flag = app.isParameterdValidate(user_id,'该用户不存在'); 
 if(flag == false){ return; } 
 // 发送请求 
 wx.request({ 
  url: url, 
  data: { 
   user_id: user_id, 
  }, 
  method: 'POST',

 //请求成功的函数处理 
 success: function (res) { 
  app.globalData.balance = res.data.data.balance;  //对数据进行更新 
  that.setData({ 
   balance: app.globalData.balance, 
  }); 
 }, 
 fail: function (res) {               //请求失败的处理 
  console.log(res.data.msg); 
 }, 
 complete: function () { 
  wx.hideNavigationBarLoading();          //完成停止加载 
  // 动态设置导航条标题 
  wx.setNavigationBarTitle({ 
   title: '我的' 
  }); 
  wx.stopPullDownRefresh();            //停止下拉刷新 
 } 
})

以上是“微信小程序如何实现下拉刷新界面”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联成都网站设计公司行业资讯频道！

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

文章名称：微信小程序如何实现下拉刷新界面-创新互联
文章地址：http://cxhlcq.com/article/dsjiid.html