小程序上拉加载,下拉刷新
小程序上拉加载,下拉刷新
data: {collectinformation: null,number: 1,size: 10,isOpenLoading: true,isEmpty: true,isLoadingTrue: true,mylist: null,mylists: null,},
onPullDownRefresh部分代码
//下拉刷新onPullDownRefresh: function(e) {this.setData({isEmpty: true,number: 1,mylist: [],isLoadingTrue: true})this.getList();},
isOpenLoading就是添加的闸门,目的是防止一个方法还没有结束就发起另外一个请求,造成num的混乱
onReachBottom: function(e) {if (this.data.isOpenLoading) {this.getList()} else {return}},
call.myRequest这边被我封装了,可以直接用自己的
getList: function() {var that = thisthat.setData({mylists: [],isShowIcon: false,isOpenLoading: false})wx.showNavigationBarLoading()var myData = {category: 0,number: that.data.number,size: that.data.size}call.myRequest("/user/collections/", that.listSuc, "POST", myData)},listSuc: function(data, res) {var that = thisvar totalList = [];that.data.mylists = data.valueif (!that.data.mylists || !that.data.mylists.length) {that.setData({isLoadingTrue: false,isShowIcon: true,isOpenLoading: false});wx.hideNavigationBarLoading();wx.stopPullDownRefresh();return}if (!that.data.isEmpty) {totalList = that.data.mylist.concat(that.data.mylists);} else {totalList = that.data.myliststhat.data.isEmpty = false}that.setData({mylist: totalList,isLoadingTrue: true,isShowIcon: true,isOpenLoading: true})wx.hideNavigationBarLoading();wx.stopPullDownRefresh();that.data.number += 1},
onLoad部分
onLoad: function(options) {this.$wuxRater = app.Wux().$wuxRaterwx.setNavigationBarTitle({title: '我的收藏',})this.onPullDownRefresh()},
转载于:https://www.cnblogs.com/chengmingxiaowu/p/9847994.html
小程序上拉加载,下拉刷新相关推荐
- 微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据 下篇
事件(wxml)>bindscrolltolower="onscrollLower" slice() 方法可从已有的数组中返回选定的元素. 请注意,该方法并不会修改数组,而是 ...
- php微信小程序向下滑动,微信小程序功能实现:上滑加载下拉刷新
本篇文章给大家带来的内容是关于微信小程序功能实现:上滑加载下拉刷新,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 之前谈到文章列表的数据加载,是一次性全部加载,这样是不友好的.这章介 ...
- ionic上拉加载-下拉刷新
ionic上拉加载-下拉刷新 1.上拉加载 <ion-infinite-scroll on-infinite="loadOlderStories()" distance=&q ...
- Mint-ui中loadmore(上拉加载下拉刷新)组件在ios中滑动会触发点击事件的解决方法...
bug说明: Mint-ui中loadmore(上拉加载下拉刷新)组件 在 使用fastclick的情况下 ,在ios设备中滑动会触发点击事件: 解决方法: 我是按需引入,去项目中找到loadmore ...
- php mescroll,mescroll.js上拉加载下拉刷新组件使用详解
本文实例为大家分享了上拉加载下拉刷新组件mescroll.js的具体代码,供大家参考,具体内容如下 使用注意事项: 1.引入的时候出问题及时看官方给出的解决方案(基本上都必须看): 2.react中一 ...
- 教你如何使用SwipeRefreshLayout来构建一个上拉加载下拉刷新框架
前言: 基本上所以的移动端应用都有Listview(当然RecyclerView也一样),那必不可少的都会嵌入一个上拉加载下拉刷新的功能.这样能大大的减少用户的流量消耗,同样对于用户也有更好的用户体验 ...
- ios 上拉加载 下拉刷新
在一款 App应用中有的时候会用到上拉加载下拉刷新的功能,本人觉得SVPullToRefresh很好用(可以用在UIScrollView上,包括UITableview和UICollectionView ...
- 微信小程序下拉刷新列表onPullDownRefresh;微信小程序上划加载列表onReachBottom;uni-app微信小程序下拉加载数据;uni-app微信小程序上划页面加载数据
需求:微信小程序列表加载有两种方式,分别是按住页面下拉加载数据数据(触发onPullDownRefresh)和直接上划滚动页面到底部加载数据(触发onReachBottom函数). 本文主要是使用上划 ...
- 微信小程序入门五上滑加载下拉刷新
之前谈到文章列表的数据加载,是一次性全部加载,这样是不友好的.这章介绍加载和刷新. 效果图: 先介绍在IDE中,怎么模拟上滑这个操作.开始我是用鼠标点击文章列表,然后先上移动.结果一直没有结果,以为是 ...
- 微信小程序 上滑加载和下拉刷新
上滑加载 :上滑是指鼠标上滑或者手指上滑,此时滚动条向下滚动,加载旧数据. 下拉刷新:下拉是指鼠标下拉或者手机下拉,此时滚动条向上滚动,加载新数据. scroll-view方法遇到的问题:如果数据量很 ...
最新文章
- 又学一招,记录之,数字日期互转
- TensorFlow 对数据集标记的xml文件解析记录
- Java反射最佳实践
- vscode 编辑器快捷键
- 数据安全备份刻不容缓 在线备份业务前景广阔
- android 之 TabHost
- Code Block 使用笔记(win7、updating)
- SpringBoot指南(八)——SpringBoot整合Redis
- mysql查询语法错误_MySQL内部联接查询语法错误
- Redis常用管理脚本
- macbook硬盘读写速度测试(Disk Speed Test 测速贴图)
- 6842. 【2020.11.5提高组模拟】淘淘蓝蓝之扮猪吃愉悦
- CentOS7升级MariaDB 10.2版本详细步骤
- Unity关节的使用和举例,布娃娃系统
- 并发完全知识点目录--yzy
- 川大计算机系1999级高伟,四川大学计算机系主任魏骁勇研发人脸识别无人机课堂点名...
- 医院在线预约挂号系统开源
- 英语语法三大从句刷题总结
- 同治光绪之交的九江城
- Matlab标题加变量