uni-app - 页面上拉触底 onReachBottom() 懒加载自动计算分页、检查是否已经请求完全部数据、自动请求接口合并数据（判断分页懒加载是否继续请求接口数据，超详细触底请求后端示例教程）_uniapp onreachbottom

作者：知新_RL | 2024-06-22 12:06:27

踩

uniapp onreachbottom

如果您需要微信小程序版本，请访问这篇文章。

网上很多教程都是页面触底后，直接请求接口，然后对应 page 页码 +1，啥时候大于总条数就停止请求，仅仅这样是远远不健壮的。

在 uniapp全端兼容（h5网页 / 支付宝微信小程序 / 安卓苹果app / nvue 等全平台）实现列表懒加载功能，当页面触底时触发分页加载功能，全自动计算当前分页和总数！

支持 uniapp v2 / v3 版本，您只需要换个后端接口就能直接使用（全端适配），

如下图所示，真实请求后端接口环境，自动分页、自动判断是否到底并与界面关联：

仅写了核心代码与简单样式，方便您观察代码。

在这里插入图片描述

注意：您需要 更改请求数据的接口，否则会报错。

您随便找个页面，复制粘贴运行起来即可。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/知新_RL/article/detail/746446