React-window: VariableSizeList 动态项目高度

创建于 2019-03-26  ·  4评论  ·  资料来源: bvaughn/react-window

我不确定如何从固定高度的示例中实现这一点。 如何测量项目元素的高度? 也许我错过了这个回购中的一些东西。 仅供参考,我正在实现具有动态高度的聊天列表。

最有用的评论

@bvaughn ,很抱歉写一个封闭的问题。 我只是想澄清一下...
这是否意味着如果我事先不知道列表项的高度,我就无法使用 VariableSizeList 来呈现具有动态内容的列表项? 例如,如果我的某些列表项中有各种大小的图像,我事先并不知道,我将无法使用 VariableSizeList 来呈现窗口化/虚拟化列表?

所有4条评论

+1

这还不被支持(除非你想及时测量内容,我不会真的推荐)。

不过,请查看问题 #6 以了解支持状态。

@bvaughn ,很抱歉写一个封闭的问题。 我只是想澄清一下...
这是否意味着如果我事先不知道列表项的高度,我就无法使用 VariableSizeList 来呈现具有动态内容的列表项? 例如,如果我的某些列表项中有各种大小的图像,我事先并不知道,我将无法使用 VariableSizeList 来呈现窗口化/虚拟化列表?

那么没有任何其他包可以在渲染之前测量建议的内容吗?

我的一个用例是虚拟化消息窗口。 事先,我知道字体、大小和文本内容。

如果我知道我的消息气泡将是 500 像素宽,那么除非我在浏览器中渲染它,否则我无法计算出气泡的高度?

及时测量有点违背了虚拟化的目的......

顺便说一句,感谢您提供的惊人包裹! 我很好地将它用于媒体提要。


编辑:事实证明,即时渲染实际上并没有那么糟糕,尤其是对于简单的文本。

此示例完美运行: https ://codesandbox.io/s/dynamic-size-of-react-window-list-items-64o9p

根据此评论: https ://github.com/bvaughn/react-window/issues/6#issuecomment -538261156

此页面是否有帮助?
0 / 5 - 0 等级