Vaadin Flow Grid 没有高度答案

【问题标题】：Vaadin Flow Grid has no heightVaadin Flow Grid 没有高度
【发布时间】：2018-07-20 13:07:18
【问题描述】：

我有以下 Grid 显示 Java 系统属性：

systemPropertyGrid = new Grid<>();
systemPropertyGrid.setItems(buildSystemProperties());
systemPropertyGrid.addColumn(SystemProperty::getProperty).setHeader("Property").setFlexGrow(1);
systemPropertyGrid.addColumn(SystemProperty::getValue).setHeader("Value").setFlexGrow(5);
systemPropertyGrid.setHeight("500px");

当我将setHeight 替换为setHeightByRows(true) 时，所有项目都会显示。但是只要我没有指定systemPropertyGrid.setHeightByRows(true)，网格在浏览器（Firefox，Edge）中的计算高度为2像素，这是边框。但是，元素样式 height 正确设置为 500px，正如我在 Firefox 开发人员工具中看到的那样。

Vaadin Flow 中的错误？这怎么可能浏览器最终不使用元素样式height？

截图：

SSCCE 使用 Vaadin Flow 弹簧启动器： my-starter-project_51443246.zip。调用 maven 目标 springBoot:run。

【问题讨论】：

您使用的是哪个版本的vaadin？我刚刚用10.0.1 对其进行了测试，但无法重现该问题。 Grid 的父级是什么？
@MehdiJavan 我正在使用相同的版本。父级是一个 VerticalLayout，以及层次结构中的其他 Div 和 VerticalLayout。我将尝试制作 SSCCE 并报告。
@MehdiJavan 你能看看 SSCCE 吗？它是否在您的机器上正确显示高度为 200 像素的网格？也许您可以在适合您的地方分享您的项目？非常感谢！

标签： vaadin vaadin10 vaadin-flow

【解决方案1】：

你是对的。它在 Firefox 中不起作用，而在 Chrome 中起作用。您可以在GitHub 中提交问题。作为一种解决方法，如果您设置父 VerticalLayout 的高度，它在 Chrome 和 Firefox 中都可以使用。因此，添加以下语句：

setHeight("500px");

【讨论】：

【解决方案2】：

已在作为 Vaadin 10.0.9 或 Vaadin 11.0.4 的一部分发布的 Vaadin Grid v5.0.5 中修复。所以你需要确保使用其中任何一个。（当然在最初发布时还没有发布）

【讨论】：