问题标签 [virtualscroll]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1777 浏览

javascript - 如何将 vue-virtual-scroller 与 Element UI Table 一起使用?

我在一个项目中使用Element UI Table,想知道如何使用 vue-virtual-scroller。

我想不出办法,因为在我看到的所有虚拟滚动器示例中,预期(如预期的那样)循环在列表项或表格行元素/组件上运行。

但是,使用 Element UI,行是基于传递给默认插槽的列组件隐式呈现的el-table

例子

所以,我不知道如何控制行渲染或在我的虚拟滚动器中包装一行。

有什么我可以做的还是我必须求助于其他允许基于行的渲染的表库?

0 投票
1 回答
232 浏览

elasticsearch - 使用弹性搜索的虚拟滚动

我正在使用 elasticsearch 和 kendo-ui 网格。现在我从无尽滚动切换到虚拟滚动。目前我在 elasticsearch 中使用 Scroll Api,但无法控制我的请求范围。

有没有办法像滚动一样获得会话,我可以在哪里发送fromand size?或者有没有更好的方法来处理这个?

0 投票
1 回答
286 浏览

ionic-framework - Ionic Virtual Scroll 是否有问题?

我正在使用 Ionic 4 并试图让 Virtual Scroll 正常工作但没有成功,实际上很长时间。

我发现文档非常详尽,有时语法很差。正如 ItemHeight 部分所说:

将每个项目映射到其高度内的可选函数。提供此功能后,ion-virtual-scroll 可以采取大量优化和快速路径,从而大幅提高性能。此功能允许跳过所有 DOM 读取,这可能会导致大量性能

现在,我没有牛津学位,但这一段错误很多,没有明确的解释,令人困惑。

所以现在。

这个 ItemHeight 对性能有帮助还是会带来性能问题?

我有没有机会让这段代码工作,因为直到现在我还不能

这里的第二个数字看起来像一个错字,不是吗?

0 投票
1 回答
1553 浏览

angular - CDK 无限滚动结束检查

我试图实现无限滚动以在用户向下滚动列表时动态地将项目加载到列表中,但是当我访问 end 和 total 时,它是一样的,我需要检查是否到达最后一个项目然后追加新的列表中的项目。问题是 end 和 total 都是相同的,并且每次都会触发

HTML

TS

Stackblitz 链接 https://stackblitz.com/edit/cdk-infinite-scroll-ufuewv

0 投票
2 回答
2241 浏览

angular - 使用行分组时primeng p-table虚拟滚动显示前行

我正在尝试创建一个p-table已分组的行,但我无法正确应用虚拟滚动功能。

p-tablePrimeNg框架的一部分。

问题是在滚动和执行延迟加载(实际上只是附加一些行)时,表格显示以前的行而不是新行。但是,如果我加载所有数据并从头到尾滚动,所有行都会正确显示。我认为这是延迟加载后刷新表期间的问题。

为了更好地理解这个问题,我在 stackblitz 上复制了它:https ://stackblitz.com/edit/angular6-primeng-8mtvwc

感谢您的任何帮助。

0 投票
1 回答
145 浏览

angular - 5.2.0 版的虚拟滚动

我有一个简单的问题,有没有办法使用 angular/cdk 版本 5.2.0 执行 angular 的虚拟滚动

因为我收到错误:src/app/app.module.ts(67,10): error TS2305: Module node_modules/@angular/cdk/scrolling"' has no export member 'ScrollingModule'。

谢谢你的帮助!

0 投票
0 回答
451 浏览

javascript - Selenium / Python - 如何访问/计算具有虚拟滚动的容器内的所有元素

我有一个cdk-virtual-scroll-viewport包含许多元素的容器,这意味着并非所有元素都一次呈现。如果我滚动,我会得到更多元素并“丢失”以前的元素。

我想要做的是计算这个容器的孩子并处理它的数据。

我已经完成了计数和处​​理部分,并且它正在工作,因为我已经检查了适合此容器的元素而无需滚动。


我遇到的问题是,因为这个容器不会一次加载所有数据,如果我使用 获取计数len(),我只会得到适合我当前屏幕的内容以及开发人员添加的元素缓冲区。

我想在这个容器的末尾循环滚动,直到我得到一个我不能滚动的异常。这当然不是最好的选择,因为它每次都会在计数中添加这个额外的缓冲区,即使它当时不可见。

这是我尝试过的,但它似乎根本没有在页面中滚动。(已headless关闭属性检查)


关于如何正确执行此操作的任何建议?我要为其编写测试的页面充满了虚拟滚动条,因此我需要一个解决方案来使用 selenium/python/javascript 执行此操作,而不仅仅是手动执行此操作。

谢谢。

0 投票
1 回答
205 浏览

ionic-framework - 列表项过多导致延迟

我在我的应用程序中使用mat-expansion-panelfrom并将它与它结合起来,这样我就不会一次加载所有它们,也不会因此而滞后。但是,一旦我滚动到底部并加载了大约 30-40 个元素,当我打开扩展面板时它就会滞后。Angular Materialinfinite scroll

我对此的第一个解决方案是使用virtual-scroll.

https://ionicframework.com/docs/api/virtual-scroll#usage

但它不支持可变高度项目。

我的下一个解决方案是infinite-scroll双向使用,但我从未见过其他应用程序使用它,所以我认为应该有更好的方法。

https://ionicframework.com/docs/api/infinite-scroll#usage

有没有其他人遇到过这个问题并以更好的方式解决了它?

0 投票
0 回答
515 浏览

angular - ionic 4虚拟滚动未在容器内设置高度

所以,我为一个页面创建了一个布局,其中包含一个标题和一个按钮,并ng-container在其中呈现 ion-virtual-scroll 的下方。但是,最后一个元素没有显示,因为我无法滚动到它们的位置,但是如果我删除布局上的所有剩余元素,那么上面的每个元素ion-virtual-scroll都是可见的。

这是布局模板

这是滚动模板

0 投票
1 回答
942 浏览

angular - 我可以在没有虚拟滚动的情况下使用 Angular PrimeNG treeTable 的惰性选项吗?

嘿伙计们,我偶然发现了prime ng treeTable的延迟加载选项的一些问题。我需要使用没有虚拟滚动条行为的lazyLoad 事件(输出属性“onLazyLoad”)。这是否受到 treeTable 组件的某种支持?

像这样的东西:

如果在没有虚拟滚动条的情况下无法使用延迟加载,那么如果我至少可以防止它破坏之前加载的元素就可以了。

我已经尝试将 rows-property 设置为 values-array 的长度,以防止在向上滚动时获取更多数据。

如果有人可以帮助我,那就太好了。