突出显示 Vaadin 标签中的子字符串

Highlight Substrings in a Vaadin Label

本文关键字：字符串 标签 显示 Vaadin      更新时间：2023-09-26

我有一个从用户输入生成的Vaadin标签。我想验证该区域的内容，并在发生错误时突出显示发生错误的文本子字符串。我知道标签支持 html 内容，所以像

Label example = new Label("Foo <span>Bar</span>", ContentMode.HTML);

使用一些 CSS 可以在标签中突出显示栏。这适用于突出显示一个子字符串，但在突出显示标签的多个部分或尝试以不同颜色突出显示时很难管理。

有谁知道一个附加组件来协助解决这个问题？

谢谢

奥利弗

我认为也没有这样的附加组件，但你可以做这样的事情：

Label example = new Label("Foo <span class=field1>Bar1</span><span class=field2>Bar2</span>", ContentMode.HTML);

然后在样式表中编写：

.error1 .field1 {
    color: red;
}
.error2 .field2 {
    color: red;
}

然后，如果您在标签的第 1 部分中有错误，您可以执行以下操作：

label.addStyleName("error1");

反之亦然，对于标签的第 2 部分。这应该将标签中的部件标记为红色。

相关文章：