如何将 "anchor" 与相关文本一起使用（不可链接）

Question

从这个问题 () 我能够使用 Vaadin 的 HTML 组件创建自定义 html 代码（并且它工作正常，包括放入 ahref links等）

但是，Vaadin 提供了 "Anchor" 组件，它似乎是创建 link 的更强大（并且可能更安全）的方式，可用于导航到其他类我建立或到外部网站（甚至下载动态以流方式生成的数据）。

但是，如果我想让普通 "label-like" 文本和锚点 link 都出现在一个段落中怎么办？例如，在 "normal html" 中，我可以这样做：

<p>
This is my normal text. 
Download <a href="/resources/excelTemplate.xlsx" download> this Excel file</a>
and follow the instructions therein
</p>

它会在我的 <p>...</p> 段落中的某处创建 link。我如何在 Vaadin 中使用 Anchor 对象执行此操作？到目前为止，我想出的最好办法是使用水平布局，然后添加一个标签、一个锚点，然后添加另一个标签——但这真的很难看，而且在技术上没有相同的效果（它不会正确包装.) 另一种选择是不使用 "Anchor" 而是只使用 "HTML" 组件并在各处创建 ahref links ，但这似乎也有点丑陋（尽管我认为这是一个好的解决方法。）。（我假设我可以通过在 ahref 调用中粘贴 url link 来调用我构建的任何 UI...）关于 "right Java Vaadin" 方法的想法这个？

Answer 1

Vaadin 10+ 为您提供（至少）三种处理此类情况的方法。你提到了其中的两个..

在Java中进行组件组合。除了 VerticalLayout 之外，您还可以将内容包装在 Div 中，并在 Div 中使用 Text 组件而不是 Label。您可以通过扩展 Composite 来制作这种自定义组件。

第二种选择是使用您提到的 HTML 组件。

第三种选择是创建自定义 html 聚合物模板并使用 PolymerTemplate class 连接到它。这将导致自定义组件的行为类似于第一个选项的自定义组件。只是实现方式不同而已。

三种方法中哪一种是正确的。从框架的角度来看所有这些。哪一个适合您取决于您的偏好和应用。

Answer 2

Paragraph p = new Paragraph("para");
Anchor a = new Anchor("go", "www.go.com");
p.add(a);
p.addClickListener(e-> UI.getCurrent().navigate(a.getHref()));

如何将 "anchor" 与相关文本一起使用（不可链接）

How to use "anchor" with associated text (that is not linkable)

vaadin

vaadin12