小程序滚动条失效【暂时失控】,如何解决

来源:5-7 目的:提前了解ES6的常用语法

小草1434

2022-04-12

前提:当小程序页面需要显示的数据超过5条时就会有滚动条,每次都向后端请求10条数据【也就是说只要后端正常返回数据都会有滚动条】
问题复现场景1:
场景说明:在当前有数据的情况下【大于5条数据】,页面下拉刷新时,页面失控,上部会出现一个空白区域,挡住了显示内容
猜想原因:触发下拉刷新时,会把新请求的数据替换原来数组的内容【比如本来20条数据,下拉刷新后会把新的10条数据替换原来旧的20条数据】
问题复现场景2:
场景说明:在当前有数据的情况下【大于5条数据】,页面上拉加载更多时,滚动条会暂时失控,不能够继续上拉加载更多数据,需要先下拉一段距离后才可以继续上拉滚动条
猜想原因:触发下拉加载数据时,当原来数组元素大于100条时,会先把之前的数组截取后40条数据,再拼接新的10条数据赋值给数组来展示页面,这个时候因为数据变更导致滚动条失效
望快速回复

写回答

3回答

7七月

2022-04-14

这块不知道代码是怎么写的,但实际上可操作的空间很小,因为这都是小程序自带的特性,没有优化空间。尝试猜测下:

  1. 空白是不是因为下拉后没有关闭掉pulldownrefresh,导致没有结束刷新

  2. 加载更多的地方有个阈值,通过设置阈值可以控制拉动多少出发加载更多

如果还不能解决,可能是因为小程序的问题,只个只能和微信社区反馈了。

1
2
小草1434
如何关闭pulldownrefresh?调用什么函数? 滚动条刷新的阈值是怎么监听或者是哪个周期控制?
2022-04-14
共2条回复

7七月

2022-04-14

没有复现你说的问题,你看看课程源码是不是有类似的问题?

0
0

7七月

2022-04-12

这个不好看到效果,你下载源码并配置看看有没有类似的问题?应该源码是没有问题的。这块没有这么复杂呀,仔细看看代码是不是数据加载代码写错了?小程序比较简单,滚动条是自带的特性不太可能出问题。

0
4
小草1434
完全可以复现,可以根据以上描述操作
2022-04-14
共4条回复

微信小程序入门与实战(全新版) 超20000人学习的好课

4年同步微信官方迭代,累计20000+人学习, 比微信官方更火爆!

23753 学习 · 6896 问题

查看课程