前言
下拉刷新和上拉加载是业务上一个很常见的需求,在微信小程序里,提供了下拉刷新的方法 onPullDownRefresh 。虽然微信的官方文档有很多坑,但下拉刷新介绍的还是很全面的。
微信小程序--下拉刷新.jpg
最近开发一款微信小程序,里面有用到下拉刷新数据的功能。于是,又开始折腾了...
一、onPullDownRefresh回调
初略看了下文档,发现小程序js中有onPullDownRefresh回调,果断重写之...
// http://itlao5.com onPullDownRefresh: function () { console.log('onPullDownRefresh') this.queryData(id) },
二、enablePullDownRefresh支持
然而,却发现不管怎么下拉,始终触发不了js回调。
只好继续看文档,发现,需要再json中配置支持下拉刷新,即:
"enablePullDownRefresh": true // 请注意是true,不是"true"字符串, // 部分开发者发现设置了还是无效, // 可能是因为设置的"enablePullDownRefresh": "true"
这个可以在app.json中进行全局配置,使所有页面都带有下拉刷新功能;也可以在需要下拉刷新功能的page对应的json中配置。
这下好了,下拉刷新功能完成了。
三、backgroundTextStyle配置
但是,还有一点点不完美的地方,别人的小程序,下拉刷新时,可以看到顶部有三个点闪烁的动画;而我的小程序顶部一片空白。
原来,还有一个配置,"backgroundTextStyle": "",支持 dark/light;因为我的背景是白色的,此时,不进行这个配置,因为颜色的缘故,三个点闪烁的动画就看不到了,因此,白色背景需要进行以下配置:
"backgroundTextStyle": "dark"
四、stopPullDownRefresh停止
此外,微信小程序还提供了停止下拉刷新效果的api,如果发现进入刷新状态,无法停止,可以使用这个api
// 小程序提供的api,通知页面停止下拉刷新效果 // http://itlao5.com wx.stopPullDownRefresh;
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对的支持。
风云阁资源网 Design By www.bgabc.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
风云阁资源网 Design By www.bgabc.com
暂无评论...
更新日志
2024年09月23日
2024年09月23日
- 华少翌.2005-华少翌【中唱艺能】【WAV+CUE】
- 群星《十二女声Ⅱ》[WAV/CUE/分轨][527MB]
- 大自然音乐系列《漫步在山裡》[WAV/CUE/分轨][502.8MB]
- 大自然音乐系列《星光夜语》[WAV/CUE/分轨][453.3MB]
- 史依弘《史依弘交响乐京剧演唱专辑HQ》头版限量编号[WAV+CUE]
- 曼丽2020《女人三十风继续吹》HQCD[WAV+CUE]
- 曼丽2021《女人三十2雾之恋》HQCD[WAV+CUE]
- 隔壁老樊.2019-我曾【好听音乐】【FLAC分轨】
- 高林生.1993-牵挂你的人是我【白天鹅】【WAV+CUE】
- 洪卓立.2012-找个懂我的女孩(国专)【英皇娱乐】【WAV+CUE】
- 曼丽2022《女人三十3晚秋》HQCD[WAV+CUE]
- 曼丽2018《女人三十4冬天》HQCD[WAV+CUE]
- 柏菲-《好歌30年壹》限量开盘母带ORMCD[低速原抓WAV+CUE]
- 大自然音乐系列《水舞》[WAV/CUE/分轨][424.3MB]
- 大自然音乐系列《星光夜语》[WAV/CUE/分轨][453.3MB]