PrimeFaces CommandButton：动态启用/禁用图标答案

【问题标题】：PrimeFaces CommandButton: Dynamically enable/disable iconPrimeFaces CommandButton：动态启用/禁用图标
【发布时间】：2012-06-08 09:18:54
【问题描述】：

PrimeFaces 的 CommandButton 允许指定图标：

<p:commandButton value="Press me" icon="redBall" ... />

但是，我需要根据 JSF 托管 bean 属性启用/禁用图标。

我试过了

<p:commandButton value="Press me" icon="#{bean.iconClass}" ... />

这适用于选择不同的图标，但不允许完全禁用图标（即获得与没有icon= 属性相同的渲染）。我可以在 getIconClass() 中返回一个空字符串，但 PrimeFaces 仍会为按钮内的图标呈现额外的 <span>，并且 CSS 样式会导致此跨度通过默认图标可见。

有没有办法告诉 PrimeFaces“我根本不需要图标”（除了完全去掉 icon= 属性）？

【问题讨论】：

【解决方案1】：

一个蹩脚的解决方法是有 2 个命令按钮。一个有图标定义，一个没有。然后渲染正确的。

【讨论】：

【解决方案2】：

我可以想出两种方法而不用复制按钮。

将图标提供为<f:attribute>，由<c:if> 有条件地添加。

<p:commandButton ...>
    <c:if test="#{not empty bean.icon}"><f:attribute name="icon" value="#{bean.icon}" /></c:if>
</p:commandButton>

设置一个完全隐藏图标的样式类并有条件地提供它。

.hideicon .ui-icon { display: none; }
.hideicon .ui-button-text { padding-left: 1em; }

与

<p:commandButton ... icon="#{bean.icon}" styleClass="#{empty bean.icon ? 'hideicon' : ''}" />

【讨论】：

嗯，使用似乎有问题，我们以后可能会决定使用无状态 JSF (industrieit.com/blog/2011/11/…)，这不适用于。 CSS 技巧看起来有点难看，但可能是最好的主意。
如果<c:if> 条件是视图范围而不是请求范围，那么这种无状态方法理论上应该有效。如果在重用同一个视图时它可能在每个请求上都发生变化，那么它确实不会在无状态 JSF 中工作。
现在我们将使用上面列出的 CSS 方法。这似乎是侵入性最小的选择。谢谢！