首页
Preview

vant-List 加载数据时@load事件一直触发

@load 事件介绍

@load 事件是 vant-List 组件的一个自定义事件,用于在列表滚动到底部时触发加载更多数据的操作。当列表滚动到底部时,会触发该事件,开发者可以通过监听该事件执行相应的业务逻辑。

@load 事件一直触发的原因

如果一次请求加载的数据条数较少,导致列表内容无法铺满当前屏幕,List 会继续触发 load 事件,直到内容铺满屏幕或数据全部加载完成。因此你需要调整每次获取的数据条数,理想情况下每次请求获取的数据条数应能够填满一屏高度。

这时我们需要调整获取数据的条数,能够保证铺满整个页面。

在 html、body 上设置 overflow 后一直触发加载?

如果在 html 和 body 标签上设置了overflow-x: hidden样式,会导致 List 一直触发加载。 html, body { overflow-x: hidden; } 这个问题的原因是当元素设置了overflow-x: hidden样式时,该元素的overflow-y会被浏览器设置为auto,而不是默认值visible,导致 List 无法正确地判断滚动容器。解决方法是去除该样式,或者在 html 和 body 标签上添加height: 100%样式。

解决方法

去除overflow-x: hidden;或将min-height: 100vh;改为height: 100vh;

原文链接:https://blog.csdn.net/Delete_89x/article/details/121281924

版权声明:本文内容由TeHub注册用户自发贡献,版权归原作者所有,TeHub社区不拥有其著作权,亦不承担相应法律责任。 如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

点赞(0)
收藏(0)
ryan
暂无描述

评论(0)

添加评论