如何在值为空或零时隐藏徽章
p:badge当值为零或为空时，我希望我的 PrimeFaces不可见。以下将显示一个带有值的徽章0：
<p:badge value="0">
<p:avatar label="Badge"/>
</p:badge>
如果我使用空值，则会显示一个空徽章：
<p:badge value="">
<p:avatar label="Badge"/>
</p:badge>
使用该rendered属性是没有选择的，因为它还会隐藏徽章的内容（p:avatar在这种情况下）：
<p:badge rendered="#{bean.value ne '0'}">
<p:avatar label="Badge"/>
</p:badge>
回答
PrimeFaces 10
查看使用空值时呈现的 HTML：
<div id="..." class="ui-overlay-badge">
<span class="ui-badge ui-widget"></span>
...
</div>
您可以使用:emptyCSS 选择器简单地隐藏空元素。因此，您可以使用 CSS 隐藏空徽章，例如：
.ui-badge:empty { display: none; }
此 CSS 规则要求您有一个空值以隐藏徽章。如果您想在值为 时隐藏徽章，则0可以使用三元表达式映射0为空：
<p:badge value="#{bean.value eq '0' ? '' : bean.value}">
<p:avatar label="Badge"/>
</p:badge>
也可以看看
- 如何使用自定义样式覆盖默认的 PrimeFaces CSS？
PrimeFaces 11+
在 PrimeFaces 11 中，引入了该visible属性。它可以像这样使用：
<p:badge value="#{bean.value}" visible="#{not empty bean.value}">
<p:avatar label="Badge"/>
</p:badge>
或者
<p:badge value="#{bean.value}" visible="#{bean.value ne '0'}">
<p:avatar label="Badge"/>
</p:badge>
或使用ApplicationFactory.