Javascript 如何通过VariableSizeList的行索引动态计算行高？

我需要通过react窗口库呈现长列表。我不能确定所有的行都是相同的大小，所以它迫使我使用VariableSizeList。所以，当您只知道行的索引和要呈现的实际数据时，有没有一种计算行高的方法

---

我认为可以以某种方式使最终用户看不到它，并从中获取高度，但我不确定这是正确的方法。

使用

VariableSizeList

时是指定

itemSize

函数

乙二醇

onGetItemSize通过以下方式测量内容：

如果内容较小，则返回单行高度

将内容写入与行相同宽度和属性的空元素。然后测量元件高度，然后再次排空元件

例如：

 onGetItemSize={((row) =>
                {
                let text = row.original.text;
                // if no text, or text is short, don't bother measuring.
                if (!text || text.length < 15)
                    return rowHeight;

                // attempt to measure height by writting text to a, kind of hidden element.
                let hiddenElement = document.getElementById(this.hiddenFieldName());
                if (hiddenElement)
                {
                    hiddenElement.textContent = text;
                    let ret = hiddenElement.offsetHeight;
                    hiddenElement.textContent = '';

                    if (ret > 0)
                        return Math.max(ret, rowHeight);
                }

                // fallback
                return rowHeight;
            })}

onGetItemSize={（（行）=>
{
让text=row.original.text；
//如果没有文字，或者文字很短，不要费心测量。
如果（！text | | text.length<15）
返回高度；
//尝试通过将文本写入某种隐藏元素来测量高度。
让hiddenElement=document.getElementById（this.hiddenFieldName（））；
if（隐藏元素）
{
hiddenElement.textContent=文本；
设ret=hiddenElement.offsetHeight；
hiddenElement.textContent=''；
如果（ret>0）
返回数学最大值（ret，行高）；
}
//退路
返回高度；
})}

然后在DOM中的适当位置包含此空元素

<div id={this.hiddenFieldName()} style={{ visibility: 'visible', whiteSpace: 'normal' }} />

<div id={this.hiddenFieldName()} style={{ visibility: 'visible', whiteSpace: 'normal' }} />