vaadin-flow - 在 Vaadin Flow 选项卡上设置图标

Question

在 Vaadin 8 中，您可以在 Tab(属于 TabSheet)上设置一个图标:

tab#setIcon(...)

在 Vaadin Flow(目前使用 14.1)中，我不知道如何在 Tab(属于 Tabs)中设置图标。它不是 API 的一部分？!

---

根据回答 Steffen Harbich 更新。

Tabs#add(new HorizontalLayout(icon, new Text(text)));

但是，结果在视觉上不是很吸引人，需要进行一些调整。

第二次更新 有更好的方法可以做到这一点，这个看起来很棒!

Tab t = tabs.add("Help", () -> { ... });
t.addComponentAsFirst(VaadinIcon.QUESTION_CIRCLE_O.create());

这is consistent使用在 MenuItem 上设置图标的方式。

Answer 1

这是可能的。使用构造函数 new Tab(Components...) 或使用 Tab#add(Component...) 添加图标。组件将显示在选项卡的标题中。例如，您可以传递一个包含图标和文本组件的 Horizo​​ntalLayout。

看看this Vaadin tab component demo ，“带有自定义内容的选项卡”段落。