1.下拉刷新

小程序页面集成了下拉功能,并提供了接口,我们只需要一些配置就可以拿到事件的回调。

1. 需要在 .json 文件中配置。 如果配置在app.json文件中,那么整个程序都可以下拉刷新。如果写在具体页面的.json文件中,那么就是对应的页面,可以下拉刷新。

具体页面的.json文件:

1 {2 "enablePullDownRefresh": true3 }

app.json文件:

1 "window": {2 "enablePullDownRefresh": true3 }

2. 在js文件中添加回调函数

// 下拉刷新回调接口

onPullDownRefresh: function () {

// do somthing

},

3. 添加数据

通常情况下的下拉刷新操作,就是把查询条件重置,让页面显示最新的一页数据。下面是笔者demo中的下拉刷新回调接口的代码,同时也是一般情况下的操作流程。

1 // 下拉刷新回调接口2 onPullDownRefresh: function () {3 // 我们用total和count来控制分页,total代表已请求数据的总数,count代表每次请求的个数。4 // 刷新时需把total重置为0,代表重新从第一条请求。5 total = 0;6 // this.data.dataArray 是页面中绑定的数据源7 this.data.dataArray = [];8 // 网络请求,重新请求一遍数据9 this.periphery();10 // 小程序提供的api,通知页面停止下拉刷新效果11 wx.stopPullDownRefresh;12 },

2 .上拉加载

同下拉刷新一样,小程序中也提供了用于上拉时回调的接口。官方文档中并没有很详细的介绍,经测试发现,上拉回调的接口并不需要额外的配置(下拉时需要在 .json文件中配置 "enablePullDownRefresh": true),直接在页面滑动到底部时就能拿到回调。

1. 在js文件中添加回调函数

1 // 上拉加载回调接口2 onReachBottom: function () {3 // 我们用total和count来控制分页,total代表已请求数据的总数,count代表每次请求的个数。4 // 上拉时需把total在原来的基础上加上count,代表从count条后的数据开始请求。5 total += count;6 // 网络请求7 this.periphery();8 },

微信小程序下拉刷新真机没效果_微信小程序 下拉刷新 上拉加载(示例代码)相关推荐

  1. 上拉加载更多后台数据_微信小程序端操作云数据库

    一.分清几个概念 1.云开发,简言之就是可以直接用微信小程序开发者工具完成一个从前台到后台的小程序项目. 2.小程序端,使用云开发的时候,miniprogram中写的代码可以叫做小程序端(真实是我不知 ...

  2. 微信小程序多次跳转后不能点_微信突然更新,但我劝你这次别升级

    时隔 42 天,iOS 版微信迎来一波正式更新,最新版本号是 7.0.15. 更新日志上,程序猿仍然很神秘,没写什么更新点.没事,到底有什么更新,就交给机哥. 终于...机哥能愉快地 吐槽 介绍新功能 ...

  3. 微信小程序点击带id参数跳转_微信小程序页面跳转方法和携带参数详解

    1.页面跳转方式 (1)标签跳转 open-type的属性值对应api里的用法即wx.的用法 1 跳转到新页面 (2)wx.navigateTo 方法跳转 此方法能够从跳转的页面会回到当前页面 1 w ...

  4. 小程序使用vant-dialog组件内容出不来_微信官方小程序同构新方案Kbone全解析

    导语 | 本文是Kbone作者june在云加社区微信群中的分享整理总结而成(编辑:尾尾).同时,june将出席11月16日的TWeb腾讯前端技术大会,欢迎现场交流. 大家好,我是来自腾讯微信小程序团队 ...

  5. 哪个是python程序中与缩进有关的正确说法_关于Python程序中与“缩进”有关的说法中,以下选项中正确的是()。_学小易找答案...

    [单选题]白内障的主要症状 [多选题]白内障病人手术后护理重点观察是 [单选题]某女,21岁.排球比赛时与队员发生碰撞,后诉鼻梁疼痛来院就诊,检查鼻腔发现鼻中隔有一小血肿.正确处理方法是 [单选题]开 ...

  6. 小程序怎么打出横线效果_成都小程序开发:哪些因素会影响小程序的运营效果?...

    相信现在微信小程序对于大家来说都不陌生了,目前小程序在市场中的占有率比较高,也是用户比较喜欢的平台.对于初次开发小程序的企业商家,在小程序的开发运营时,往往会有一些细节性的问题,影响到小程序的运营效果 ...

  7. 微信内分享域名防红方案-微信域名防封跳转技术的方案解析_微信域名防封推广源码

    想必使用微信分享app链接或其他链接的时候都遇到过被封被拦截的情况,这在现在是已经见怪莫怪了.但是一次两次还 好,总是这样也吃不消,不说别的就光去换域名都花了不少钱.那么大家一定想知道别人推广的时候怎 ...

  8. 微信上h5页面点击文件下载链接没反应,微信内直接下载app方案

    大家在使用微信分享转发链接的时候,都很容易碰到链接在微信中无法打开网页的问题.通常这种情况微信会给个提示 "已停止访问该网址" ,导致这个情况的因素有以下三点. 1.分享链接被多人 ...

  9. h5可以获取本机手机号码么_重大突破 | 极验无感本机认证实现H5amp;小程序场景全覆盖,打造一键登录解决方案...

    验证是企业业务场景中出现频次非常高的一环,短信验证码作为校验用户身份,拦截黑产的利器,迅速成为主流.但是面对频发的短信收发延迟,短信泄露资产受损等问题,短信验证码从对抗黑产利器一下子成为运营鸡肋,增长 ...

最新文章

  1. HTTP和HTTPS协议的区别
  2. android开发学习 ------- 弹出框
  3. 强大js web甘特图制作之甘特图的日历
  4. 直播 | DSTC 8“基于Schema的对话状态追踪”竞赛冠军方案解读
  5. Codeforces Round #506 (Div. 3) - D. Concatenated Multiples(思维)
  6. matlab导入txt生成曲面,求助:怎样将txt的数据导入到Matlab中并根据参数画出波形...
  7. 构造函数模式知识的扩展
  8. android仿美丽说登录拖拽Layout
  9. Spring静态资源解决方案
  10. IMPLEMENT_DYNCREATE(CFileView, CView)
  11. 常用软件运维部署篇(一)--Linux安全加固
  12. 基于JEECG框架,前台VUE,后台java,导入导出
  13. cocos2dx检测及预防外挂加速
  14. 不小心删了(或覆盖了)window系统变量的PATH的怎么办?
  15. 使用C/C++制作简单的俄罗斯方块 一
  16. 【体系结构】山东大学计算机体系结构知识点清单
  17. 【毕业设计】基于stm32的便携式U盘设计与实现 - stm32制作U盘
  18. vue仿今日头条_Vue仿今日头条实例详解
  19. 线性代数精华2——逆矩阵的推导过程
  20. 青铜修炼手册:Axure实现水波纹效果

热门文章

  1. 电脑日历怎么显示节假日win10?
  2. python 写出好看且实用的后台管理-django 后台管理美化
  3. mybatisPlus 自定义sqlSessionFactory sql注入器失效 Invalid bound statement (not found): insertBatchSomeColumn
  4. 问道打开时显示连接服务器失败怎么办,荒野行动连接不上服务器怎么办 服务器连接失败解决-游侠手游...
  5. vscode 添加用户代码片段(快速生成 vue 模板)
  6. 电容或电感的电压_电源系列之BUCK电源电感的工作模式
  7. 微信小程序——服务通知,发送订阅消息
  8. 工程监测仪器振弦模拟信号采集仪VTN的传感器接口
  9. 惩罚函数内点法c语言,分享:惩罚函数法(内点法、外点法)求解约束优化问题最优值...
  10. 就业指导——自我介绍与个人简历