微信小程序实现分页加载,触底加载下一页,滚动加载

这里我就不写wxml了,就是一个列表循环,直接看js代码逻辑,注释都写在代码后面了,这个方法可以实现无限滚动加载,直到加载完最后一条数据,也可以实现触底没数据后,二次触底可以从新加载刷新,学废了就给个三联把,感谢!

  data: {orderList: [],pageSize: 10,pageNum: 1,},/*** 上拉触底 onReachBottom微信自带的触底函数*/onReachBottom: function () {if (this.data.pageNum * this.data.pageSize == this.data.orderList.length) { // 数据列表的数量刚好等于页数*每页条数,可以请求下一页this.setData({pageNum: this.data.pageNum + 1, // 一般上拉触底是为了加载更多分页数据,所以这里页数自增});this.getorderList() // 查询列表方法} else { // 数据列表的数量不等于页数*每页条数,说明当前页数据不足10条,已经没有更多数据了this.setData({noMor: true  // 这里在页面最底部显示一排文字,没有更多数据了})}},// 获取列表数据方法getorderList() {app.http.getOrder({pageNum: this.data.pageNum,pageSize: this.data.pageSize}).then(res => {if (res.data.length == 0) { //请求的数据为空,没有数据if (this.data.pageNum == 1) { // 第一页都没有数据,直接显示暂无数据this.setData({noData: true,})} else { // 不为第一页时,请求的数据为空,说明没有更多数据了,把pageNum减一,是为了下次触底可以继续请求刷新,万一有了新数据也可以正常显示出来this.setData({noMor: true,pageNum: this.data.pageNum - 1})}} else {  // 请求的结果有数据额if (res.data.length == this.data.pageSize) { // 请求的数据为10条,说明下一页可能还有数据,列表添加上新的数据,把其他状态设为不显示this.setData({orderList: [...this.data.orderList, ...res.data],noMor: false,noData: false})} else { // 请求的数据没有10条,说明下一页已经暂时没有数据了,列表添加上新的数据,底部显示暂无更多数据this.setData({orderList: [...this.data.orderList, ...res.data],noMor: true,noData: false})}}})},

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/70358.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

某地刑侦大队对涉及6个嫌疑人的一桩疑案进行分析

(1)A、B 至少有一人作案; (2)A、E、F 三人中至少有两人参与作案; (3)A、D 不可能是同案犯; (4)B、C 或同时作案,或与本案无关&#xf…

今天,微软重新发明搜索引擎:首款ChatGPT搜索来了

从现在起,比 ChatGPT 更强大的语言模型直接进入了你的浏览器。 一夜之间,全球最大的科技公司仿佛都回到了自己年轻时的样子。 在谷歌宣布「实验性对话式人工智能服务」Bard 之后仅 24 小时,北京时间 2 月 8 日凌晨两点,微软发布了…

嵌入式工程师的入门须知----亲测

嵌入式工程师的学习路线----亲测 本文概述入门之前必做竭尽所能了解嵌入式技术与职业规划正确认识自己 我眼中的嵌入式技术我眼中的职业规划我的入门之路总结 本文概述 这是一篇关于想要踏进嵌入式技术之路与相关职业规划的建议性文档,文中观点仅限于个人对于嵌入式…

嵌入式软件工程师面试必备技能

随着当前信息化网络技术在各行业的快速普及,嵌入式系统在技术领域呈现了前所未有的发展趋势,作为一个正在崛起的热门IT行业,人才的匮乏已经成为了嵌入式开发行业发展过程中呈现出的一种现象。据相关部门统计,我国目前嵌入式软件工…

电子通信、嵌入式工程师的面试指南

作者:火哥 授权转载自公众号嵌入式老鸟的职场之道(id:ict_embedded),火哥也是我们的校园代理 火哥自从校招找工作到现在,面试过不下50家公司,拿到过不少于30个offer。虽然不能说百战百胜,但是也还算有着较…

嵌入式软件工程师培训:提升技能、实现卓越

如果您对嵌入式培训感兴趣,以下是一些建议和关键点,可以帮助您进行嵌入式培训: 培训目标:明确确定您的嵌入式培训目标。是为了提升员工的技能水平,使他们能够承担更高级别的嵌入式开发工作,还是为了向非嵌入…

嵌入式工程师常用的软件工具推荐

前言:常言道:工欲善其事,必先利其器。作为一名合格的嵌入式工程师,日常可能需要接触和处理各种奇奇怪怪的问题,这时候一款高适配性的工具将会令工作效率大大提升。作者根据个人的实际使用情况与粉丝的客观感受&#xf…

软考中级-嵌入式系统设计师(一)

第一章 硬件基础 1、嵌入式微处理器结构 ARM采用哈佛结构,是一种RISC体系结构的微处理器。 DSP(数字信号处理技术)采用哈佛结构,具有专门的硬件乘法器,广泛采用流水线操作,提供特殊的指令,可以用…

嵌入式软件工程师学习路线图

人们去学习嵌入式的话,最后也是想成为嵌入式软件工程师的,这对于学习嵌入式学员来说还是有些难度的,所以这回小编就给大家介绍下嵌入式软件工程师学习路线图吧。 点击获取1V1嵌入式学习规划,现在还送100G精选学习资料。&#xff0…

嵌入式工程师的『2022 || 2023』

因为一些个人关系,2022年初我从北京回到了石家庄。在找工作,包括后续的研发工作中,不同地点的经历在对比中我逐渐总结出了一些经验。关于“人”方面的感悟我就不赘述了,下面主要在这里总结一些找工作,做工作的经验&…

嵌入式工程师必备开发工具

其实入行也有2年了,这两年用到了不少的开发工具,我猜大家很多也都用到过。这里主要是讲一下用到那些工具,安装自己去找教程吧!毕竟安装这些软件可比开发容易多了! 1.KEIL5 嵌入式产品开发写代码用到的工具。STM32相关…

送5本新出版《趣学算法(第2版)》

文末赠书 学大家在学习算法时遇到的各种困难:看不懂、题目刷了忘然后忘了刷、大部头算法书啃不动。甚至不少人学算法都开始怀疑自己是不是太笨不适合编程了…… 如何轻松学算法? 今天给大家推荐一本《趣学算法(第2版)》。这本书第…

Python趣味代码整合之提升学生编程兴趣

这篇文章主要是整合一些趣味代码,一方面自己对这些内容比较感兴趣,另一方面希望这些代码能提升学生的编程兴趣,其主旨是代码能在我的电脑上运行并有些趣味。 参考资料: 知乎 - 可以用 Python 编程…

趣学算法第二次

14天阅读挑战赛一、一棋盘的麦子 计算一棋盘的麦子&#xff0c;python代码如下&#xff1a; import matplotlib.pyplot as plt s[] def cal(n):sum0i0while i<n:sumsumpow(2,i)i1s.append(sum)return s nint(input("请输入一个数&#xff1a;")) xrange(n1) for …

《趣学算法》阅读笔记(二)

14天阅读挑战赛 话不多说&#xff0c;我们接着上篇文章《趣学算法》阅读笔记&#xff08;一&#xff09;&#xff0c;继续总结学习 1. 第一章 算法之美 1.3 哥德巴赫猜想的证明 哥德巴赫猜想&#xff1a;任一大于2的偶数&#xff0c;都可表示成两个素数之和。 验证&#xff1…

趣学python编程答案_《趣学Python编程》习题总结

上周买了本书叫《趣学Python编程》&#xff08;英文名&#xff1a;Python for kids&#xff09;&#xff0c;昨天看完后把书后面的题都做了下。由于第1、2章没有习题&#xff0c;第13章及之后都是描写实例的章节&#xff0c;因此这个总结性的文章中只包含了第3-12章的习题答案。…

小鹅通课程下载(一)

【需求】 花钱买了小鹅通付费课程&#xff0c;想要下载到本地观看或者存档&#xff1f; 【问题】 直接下载视频会有aes-256加密&#xff0c;要自己通过m3u8找密钥用openssl解码 【解决方案】 &#xff08;仅用于windows系统&#xff09; 小鹅通exe运行工具&#xff0c;双击打…

GPT4官方联网功能和插件功能

chatgpt免费入口 http://chat.xutongbao.top https://mbd.baidu.com/newspage/data/landingsuper?context%7B%22nid%22%3A%22news_9764161741531547244%22%7D&n_type-1&p_from-1

mac微信备份位置macos手机微信备份的文件迁移走

mac微信备份位置 如果你没有更改过mac版微信的备份文件夹的位置的话&#xff0c;那么mac版微信备份的聊天记录被保存在电脑的【/User/用户/Library/Containers/com.tencent.xinWeChat/Data/Library/Application Support/com.tencent.xinWeChat/】 一个叫【Backup】的文件夹当…

One Chat for Mac(多功能聊天软件)

One Chat for Mac版,这款软件并不能直接进行聊天服务&#xff0c;但是One Chat Mac可以将一系列的聊天软件进行整合并拥有易于使用的用户界面和用户体验&#xff0c;并且提示通知全部都可以自定义。 测试系统&#xff1a; Macos10.14.6系统 One Chat for Mac版教程 下载完成…