如何实现小程序列表的懒加载功能？

本文共计2179个文字，预计阅读时间需要9分钟。

目录+小程序上的列表懒加载+分页加载+使用scroll事件监听+使用IntersectionObserver监听+前端分页渲染+使用IntersectionObserver替代onReachBottom+加载数据！+demo源码+参考+小程序上的列表懒加载+长列表我们！

目录

• 小程序上的列表懒加载
• 分页加载
• 用scroll事件监听
• 用IntersectionObserver监听
• 前端分页渲染
• 用IntersectionObserver代替onReachBottom
• 加需求！
• demo源码
• 参考

小程序上的列表懒加载

长列表我们经常接触到，长列表为什么需要懒加载呢，因为一旦渲染内容多了，渲染引擎就需要更多的时间去渲染画面，这时可能会出现页面白屏、卡顿等。而用户其实只需要看到视窗内的内容就可以了，不用一次性把全部内容渲染完，所以可以通过懒加载实现。