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

发布时间 - 2026-01-11 03:27:41    点击率:

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

利用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();            //停止下拉刷新 
 } 
}) 

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!


# 微信小程序下拉刷新界面  # 小程序  # 下拉刷新的实现方法  # 微信小程序下拉加载和上拉刷新两种实现方法详解  # 微信小程序下拉刷新PullDownRefresh的使用方法  # 微信小程序实现列表下拉刷新上拉加载  # 微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析  # 微信小程序实现下拉刷新和轮播图效果  # 微信小程序 列表的上拉加载和下拉刷新的实现  # 微信小程序下拉刷新组件加载图片(三个小点)不显示刷新状态的问题  # 设为  # 导航条  # 加载  # 如有  # 希望能  # 不存在  # 实际情况  # 谢谢大家  # 该用户  # 栏中  # 并结合  # 疑问请  # 选项中  # request  # wx  # XXX  # brush  # strong  # title  # showNavigationBarLoading 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 西安专业网站制作公司有哪些,陕西省建行官方网站?  Laravel如何正确地在控制器和模型之间分配逻辑_Laravel代码职责分离与架构建议  Laravel如何配置任务调度?(Cron Job示例)  如何快速生成专业多端适配建站电话?  Laravel Sail是什么_基于Docker的Laravel本地开发环境Sail入门  canvas 画布在主流浏览器中的尺寸限制详细介绍  微信小程序制作网站有哪些,微信小程序需要做网站吗?  Laravel表单请求验证类怎么用_Laravel Form Request分离验证逻辑教程  文字头像制作网站推荐软件,醒图能自动配文字吗?  高防网站服务器:DDoS防御与BGP线路的AI智能防护方案  Win11搜索不到蓝牙耳机怎么办 Win11蓝牙驱动更新修复【详解】  Laravel如何实现全文搜索_Laravel Scout集成Algolia或Meilisearch教程  香港服务器租用费用高吗?如何避免常见误区?  北京网站制作的公司有哪些,北京白云观官方网站?  三星网站视频制作教程下载,三星w23网页如何全屏?  php485函数参数是什么意思_php485各参数详细说明【介绍】  php json中文编码为null的解决办法  进行网站优化必须要坚持的四大原则  百度浏览器ai对话怎么关 百度浏览器ai聊天窗口隐藏  东莞专业网站制作公司有哪些,东莞招聘网站哪个好?  佐糖AI抠图怎样调整抠图精度_佐糖AI精度调整与放大细化操作【攻略】  Laravel如何使用Vite进行前端资源打包?(配置示例)  悟空识字如何进行跟读录音_悟空识字开启麦克风权限与录音  最好的网站制作公司,网购哪个网站口碑最好,推荐几个?谢谢?  Laravel如何实现用户角色和权限系统_Laravel角色权限管理机制  网站制作怎么样才能赚钱,用自己的电脑做服务器架设网站有什么利弊,能赚钱吗?  香港服务器WordPress建站指南:SEO优化与高效部署策略  Laravel怎么配置S3云存储驱动_Laravel集成阿里云OSS或AWS S3存储桶【教程】  Laravel怎么解决跨域问题_Laravel配置CORS跨域访问  购物网站制作费用多少,开办网上购物网站,需要办理哪些手续?  如何在景安服务器上快速搭建个人网站?  如何有效防御Web建站篡改攻击?  微信小程序 input输入框控件详解及实例(多种示例)  jQuery 常见小例汇总  Edge浏览器如何截图和滚动截图_微软Edge网页捕获功能使用教程【技巧】  极客网站有哪些,DoNews、36氪、爱范儿、虎嗅、雷锋网、极客公园这些互联网媒体网站有什么差异?  Claude怎样写结构化提示词_Claude结构化提示词写法【教程】  油猴 教程,油猴搜脚本为什么会网页无法显示?  如何在IIS7中新建站点?详细步骤解析  Internet Explorer官网直接进入 IE浏览器在线体验版网址  如何用JavaScript实现文本编辑器_光标和选区怎么处理  HTML 中如何正确使用模板变量为元素的 name 属性赋值  如何快速生成凡客建站的专业级图册?  深圳网站制作公司好吗,在深圳找工作哪个网站最好啊?  国美网站制作流程,国美电器蒸汽鍋怎么用官方网站?  高性能网站服务器配置指南:安全稳定与高效建站核心方案  网站广告牌制作方法,街上的广告牌,横幅,用PS还是其他软件做的?  Laravel怎么实现前端Toast弹窗提示_Laravel Session闪存数据Flash传递给前端【方法】  Laravel定时任务怎么设置_Laravel Crontab调度器配置  佛山企业网站制作公司有哪些,沟通100网上服务官网?