v-infinite-scroll无限滚动无法触发

最新推荐文章于 2024-07-17 08:44:51 发布
最新推荐文章于 2024-07-17 08:44:51 发布
阅读量6.9k 收藏 2
点赞数 2
文章标签： css 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fxxkingpineapple/article/details/123446800
版权

element的v-infinite-scroll滚动到底部时无法触发，查了许久，官方文档和度娘查到的都是说在添加 v-infinite-scroll元素的父元素上设置overflow:auto即可，但是依旧无法生效

凑巧将overflow:auto加到子元素上就生效了

Painappuru-v
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
v-infinite-scroll（Element UI） 滚动到底不触发（笔记本）
u012169390的博客
10-28 6696
v-infinite-scroll（Element UI） 滚动到底不触发（笔记本）现象先答案原因解决思路1、设置滚动元素的padding2、反复设置padding放弃，查看数据层3、读源码其他尝试1、可能是disabled 传值为false2、dom之间的嵌套关系、padding、margin3、嵌套了draggable 现象 1.我用14寸win笔记本开发连普通屏幕正常，测试用的笔记本（1920 分辨率，150%缩放）测出此问题 2.用chrome调试工具测试不同分辨率，某些分辨率偶尔复现此问题，小于
使用Element的InfiniteScroll 无限滚动组件报错的解决
12-28
一、问题描述 在使用Element的InfiniteScroll 无限滚动时候出现以下错误： TypeError: Failed to execute ‘observe’ on ‘MutationObserver’: parameter 1 is not of type ‘Node’ InfiniteScroll的更多用法element官网 二、解决办法 给需要使用 InfiniteScroll 的元素或者它的父级元素加上 overflow:auto; 属性即可。 <template> <div class=home> <div v-infinite-scroll=l
element UI中 InfiniteScroll 无限滚动 组件触底失效问题排查
工作中遇到问题记录
06-19 463
element UI中 InfiniteScroll 无限滚动 组件触底失效问题排查
【区分vue2和vue3下的element UI InfiniteScroll 无限滚动组件，分别详细介绍属性，事件，方法如何使用，并举例】
最新发布
xiejunlan的博客
07-17 684
需要澄清的是，在 Element UI（Vue 2）和 Element Plus（Vue 3 的 Element UI 官方替代品）中，并没有直接名为的无限滚动组件。然而，Vue 社区和 Element UI/Plus 的用户经常通过结合 Vue 的指令（如，这通常是一个第三方库如提供的）或者自定义组件来实现无限滚动的功能。不过，为了回答你的问题，我将分别介绍在 Vue 2 和 Vue 3 环境下如何结合一个假设的无限滚动功能（可能通过第三方库如）和 Element UI/Plus 组件库来实现无限滚动。
elementui InfiniteScroll 无限滚动，在移动端会出现的问题
qq_53026081的博客
04-13 1428
我们在做pc时，一般的数据都会使用表格进行数据的分页处理，但是当到移动端时，我们对数据的处理一般都会使用列表的显示方式。这样的开发模式我们就会使用到elementui InfiniteScroll 无限滚动。根据文档这部分，写了我的代码，开始长下面这样子…结果发现了一个问题，就是进入页面之后像是 infinite--disabled和infinite-scroll-immediate没有生效似的，页面疯狂调用onLoad函数。
v-infinite-scroll失效，v-infinite-scroll在弹窗中失效，在dialog中失效
qbbhgn的博客
11-03 3662
v-infinite-scroll滚动到底或第一次都无法生效
v-infinite-scroll不触发问题
qq_51682771的博客
07-24 1988
1.一次请求的数据不能占满整个container，默认加载页面时会不断请求数据，直到overflow外面的容器，但点击最新时，清除数据，不能再overflow，所以就算滚动到底也无法触发。初次加载页面，默认综合的时候可以无限滚动，当点击最新的时候失效。
列表项按需加载 v-infinite-scroll 滚动条触底无效 解决方案
csyldjy的博客
04-28 3032
后台返回的分页数据需要实现滚动条触底加载下一页， 用了element-ui 的指令来实现。但是发现在某一分辨率下, 滚动条触底时未触发加载方法。
【Bug】v-infinite-scroll 下滑加载未生效
不务正业的野猴子
11-13 4252
<ul class="list" style="align-items: normal;" v-infinite-scroll="load" infinite-scroll-disabled="disabled"> <li v-for="item in itemList" class="list-item" style="align:left" @click="showChang...
v-infinite-scroll 只在页面加载后触发一次 || 滚轮划到低端时不触发 的问题
天道酬勤
09-18 7276
环境：Nuxt+ElementUI 问题：使用瀑布流加载，但是只在页面加载完毕后触发一次，之后再不触发 解决方式：将 v-infinite-scroll=“loadMore” 放在一个更大的标签下 ...
记录 v-infinite-scroll=“load“ 在f12关闭的情况下不触发解决办法
一个超爱喝可乐的web前端攻城狮
09-08 484
直接上答案 , 后续看了源码发现问题会继续更新为什么要加 这个 1。
Infinite-Scroll无限滚动加载数据
08-30
Infinite-Scroll无限滚动加载数据
使用vue-infinite-scroll实现无限滚动效果
08-27
在构建具有大量数据流的应用时，无限滚动（Infinite Scroll）是一种常见的功能，它可以在用户滚动页面接近底部时自动加载更多内容。Vue-infinite-scroll 是一个专门为 Vue 设计的无限滚动插件，它可以帮助开发者轻松...
react-infinite-scroll:ReactJS无限滚动方法
05-12
3. **使用组件**：将InfiniteScroll作为容器，包裹需要无限加载的内容。通常，你需要提供一个数据数组，一个加载更多数据的回调函数，以及一个判断是否还有更多数据可加载的布尔值。 ```jsx function MyComponent...
详解无限滚动插件vue-infinite-scroll源码解析
10-17
总的来说，`vue-infinite-scroll` 插件通过监听滚动事件、判断滚动位置以及触发加载更多数据的回调，实现了无限滚动的功能。它的设计考虑了性能优化，避免频繁触发回调，同时也提供了灵活的配置项，适应不同的应用...
vue-infinite-scroll 搭配使用ant-design-vue 弹窗dialog无法触发loadMore方法
LoveHaixin的博客
02-16 557
vue-infinite-scroll 搭配使用ant-design-vue 弹窗dialog无法触发loadMore方法
页面刷新disabled就无效了_v-infinite-scroll插件首次进入页面无效，刷新页面后可以上拉加载刷新如何解决？...
weixin_39870092的博客
12-22 667
<wv-group title="" v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance="50" style="padding:0"><ul><li v-for="(item,index) in boxdata" :key="item.ind...
VUE用elementUI实现无限滚动组件（InfiniteScroll）
weixin_45594156的博客
06-06 1794
前言：一个页面引入无限滚动组件，把InfiniteScroll写成组件使用。这里只说明核心部分。 InfiniteScroll组件：包含了样式"**加载中**"、"**没有更多数据**"、"**暂无数据**"样式
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值