Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/39.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 计算div中将使用多少行?_Html_Css_Reactjs_React Virtualized - Fatal编程技术网

Html 计算div中将使用多少行?

Html 计算div中将使用多少行?,html,css,reactjs,react-virtualized,Html,Css,Reactjs,React Virtualized,在下面的代码段中,有四个div,每个div包含33个字符。根据宽度和换行方式,div可以使用一行、两行或三行。什么是提前计算的好方法 我之所以需要它,是因为我使用了React List组件(),它接受列表项高度的固定值,或者使用函数根据索引计算列表项的高度。使用该索引,我可以检索div中的文本,并使用JavaScript获取列表的宽度。根据这些变量,我有希望计算出合适的高度 .p100{ 宽度:100px; } .p150{ 宽度:200px; } 你好你好你好 zhu zhu zhu z

在下面的代码段中,有四个div,每个div包含33个字符。根据宽度和换行方式,div可以使用一行、两行或三行。什么是提前计算的好方法

我之所以需要它,是因为我使用了React List组件(),它接受列表项高度的固定值,或者使用函数根据索引计算列表项的高度。使用该索引,我可以检索div中的文本,并使用JavaScript获取列表的宽度。根据这些变量,我有希望计算出合适的高度

.p100{
宽度:100px;
}
.p150{
宽度:200px;
}

你好你好你好

zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu
你好你好你好
zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu zhu
你似乎在说,你想知道在单词重叠之前还有多少行


如果是这种情况,您可以将宽度更改为
width:auto
或将其设置为
100%
。这样,它会随着你的“行”展开。

你似乎在说,你想知道在单词重叠之前还有多少行


如果是这种情况,您可以将宽度更改为
width:auto
或将其设置为
100%
。这样,它将用您的“行”展开。

通过jquery,您可以通过以下方式获得每个div的宽度和高度:

$('#the-div-id').width();
$('#the-div-id').height();
和javascript:

document.getElementById('the-div-id').clientWidth;
document.getElementById('the-div-id').clientHeight;

通过jquery,您可以通过以下方式获得每个div的宽度和高度:

$('#the-div-id').width();
$('#the-div-id').height();
和javascript:

document.getElementById('the-div-id').clientWidth;
document.getElementById('the-div-id').clientHeight;
我之所以需要它,是因为我使用了一个React List组件…它接受列表项高度的固定值,或者一个函数来根据索引计算列表项的高度

你好:)这里是react虚拟化的作者

我认为您应该查看
CellMeasurer
组件。我为您描述的用例创建了它。查看演示和文档

本质上,
CellMeasurer
允许您将文本测量推迟到运行时<代码>列表在此之前可以为尚未可见的行使用估计大小

我之所以需要它,是因为我使用了一个React List组件…它接受列表项高度的固定值,或者一个函数来根据索引计算列表项的高度

你好:)这里是react虚拟化的作者

我认为您应该查看
CellMeasurer
组件。我为您描述的用例创建了它。查看演示和文档


本质上,
CellMeasurer
允许您将文本测量推迟到运行时<代码>列表在此之前,对于尚未可见的行,可以使用估计的大小。

如果将宽度/高度设置为
自动
则div将足够大,足以容纳其内容。您所说的“提前计算”是什么意思?比如将行数存储为JavaScript变量?或者找到CSS中的行数?在@Santi的问题旁边,你能说一下你为什么想要这个吗?也许有另一种解决方案可以解决添加了我的动机后所遇到的任何问题。如果您将宽度/高度设置为
auto
,div将足够大,可以容纳其内容。您所说的“提前计算”是什么意思?比如将行数存储为JavaScript变量?或者找到CSS中的行数?在@Santi的问题旁边,你能说一下你为什么想要这个吗?也许有另一个解决办法来解决你在加入我的动机后遇到的问题。我加入了我的动机。我无法设置宽度,这是给定的。我添加了我的动机。我无法设置宽度,这是给定的。我需要计算高度(取决于文本数量和宽度),然后再渲染。因此我认为javascript没有帮助,我认为它必须在服务器中计算。也许你正在设计一个非常特殊的东西,否则这不是你想要的正常情况,会有更好的方法。我需要在渲染之前计算高度(取决于文本的数量和宽度)。所以我认为javascript没有帮助,我认为它必须在服务器中计算。也许你正在设计一个非常特殊的东西,否则你想要的就不正常了,会有更好的办法。嗨,布莱恩!谢谢如果我遇到问题,我会尽快告诉你。嗨,布莱恩!谢谢如果我遇到问题,我会尽量让你知道。