问题标签 [react-virtual]
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.
reactjs - 如何创建一个有限但由 api 调用扩展的“窗口”列表，并且行可以具有不同的高度？
我希望从 api 调用中呈现一个长列表，从 api 获取整个列表很慢，大多数用户不会查看整个列表，因此在滚动到可见列表底部时进行额外的 api 调用是目标。列表中每个项目的高度将不同，并且取决于每个项目的 api 响应中的文本量。
似乎有三个不同的库：
react-virtualized: 基于类，维护频率较低，我无法List使用Autosizer,CellMeasurer和InfiniteLoader.react-window：同一作者，react-virtualized只有更新和更简单，支持在滚动到底部时调用和 API（InfiniteLoader）或允许可变大小的列表（VariableSizeList）但看起来不是两者：如何在 react-window 中的 VariableSizeList 中获取内容感知非重叠行？react-virtual: 最近更新和维护，基于钩子接口。
我不确定我是在找错地方还是什么，但这项任务似乎很难实现？实现这样一个列表的最佳方法是什么？
reactjs - 有没有办法将 useVirtual 与 Material-UI Select 集成
当有超过 200 个选项时，Material-UI Select 会滞后。
这是一个已知问题 - https://github.com/mui-org/material-ui/issues/17001
我尝试使用useVirtual钩子来解决它react-virtual。
到目前为止，它效果不佳。
我创建了这个沙箱：https ://codesandbox.io/s/lucid-ritchie-j2c13?file=/src/Demo.tsx
如果还有其他方法可以虚拟化 中的项目Material-UI Select，我会接受。
这是我的代码：
reactjs - 使用 react-virtual 模块修复行和列
当我使用具有绝对位置的列索引 0 覆盖 div 并给它一个与 left: 0 保持一致的位置时，第一列样式就会中断。是否可以使用 react-virtual 固定列或行？
combineStyles 是我编写的一个函数，它使我能够有条件地向元素添加一些样式。
reactjs - Material UI TableRow 和绝对位置
我正在使用react-virtual在 Material UI 表上实现虚拟化，如果对行使用绝对位置，则会遇到表对齐问题
这是一个示例：https ://codesandbox.io/s/old-cdn-n95z5?file=/src/index.js 如果 position: absolute 被删除，则表格内容根据表格标题正确对齐，但在这种情况下是虚拟化不管用
javascript - 反应虚拟滚动条错误
我正在尝试对我的项目使用 react-virtual，并且在使用动态选项时遇到了滚动条问题。示例： https ://codesandbox.io/s/resizeobserver-react-virtual-6131c?file=/src/index.js
你可以看到，当我们滚动时，光标移出滚动条。在这种情况下，我看到了问题
高度：
${rowVirtualizer.totalSize}px
rowVirtualizer.totalSize 将提供一个错误的近似高度，当我们滚动时，将重新计算新的高度并使光标移出滚动条。
我们可以改进它吗？谢谢