uniapp开发微信小程序笔记10-触底加载

前言:

触底加载需求描述:

经常在做一些商品列表页的时候,如果一次性加载大量数据会影响性能,一般都是先加载10-20条,等用户向下滑到底部时再加载新的数据并渲染上去。

1、官方提供了一个API:onReachBottom

来处理页面滚动到底部的事件,可以看到官方文档中把这个事件归在页面生命周期里,所以可以按照页面生命周期的方式写代码

javascript 复制代码
onReachBottom(){
    console.log('触底了!')
}

可在pages.json里定义具体页面底部的触发距离onReachBottomDistance

比如设为50,那么滚动页面到距离底部50px时,就会触发onReachBottom事件。

2、如果是用的scroll-view渲染

可以用scrolltolower来触发滚动到底部的事件

属性名 类型 说明
@scrolltoupper EventHandle 滚动到顶部/左边,会触发 scrolltoupper 事件
@scrolltolower EventHandle 滚动到底部/右边,会触发 scrolltolower 事件
相关推荐
独小乐6 分钟前
009.中断实践之实现按键测试|千篇笔记实现嵌入式全栈/裸机篇
linux·c语言·驱动开发·笔记·嵌入式硬件·arm
无聊大侠hello world13 分钟前
Yu-AI-Agent 项目(AI 恋爱大师智能体) · 学习笔记
人工智能·笔记·学习
CheerWWW30 分钟前
C++学习笔记——箭头运算符、std::vector的使用、静态链接、动态链接
c++·笔记·学习
0vvv035 分钟前
2026-NCTF-web-N-RustPICA
前端·ctf
前进的李工35 分钟前
MySQL角色管理:权限控制全攻略
前端·javascript·数据库·mysql
芯智工坊36 分钟前
第13章 Mosquitto监控与日志管理
前端·网络·人工智能·mqtt·开源
ZhiqianXia1 小时前
Pytorch 学习笔记(17):decompositions.py —— 算子分解的百科全书
pytorch·笔记·学习
xian_wwq1 小时前
【学习笔记】大模型如何理解图片
笔记·学习
洒满阳光的庄园1 小时前
Electron 桌面端打包流程说明
前端·javascript·electron
talen_hx2961 小时前
《零基础入门Spark》学习笔记 Day 13
笔记·学习·spark