PrimeFaces inputSwitch如果在隐藏的div中，则无法正确显示

Question

我在按下按钮时显示InputSwitch内的<div>。

显示InputSwitch时，<div>无法正确呈现 - 它只显示为一个灰色的薄框。如果将InputSwitch放在隐藏的<div>之外，那就好了，所以它似乎与隐藏在<div>内部有关。

显示时我应该进行某种初始化吗？我的示例代码如下

This is rendered correctly
<p:inputSwitch value="#{bean.booleanValue}"/>

<div style="display:none" class="hidden-test">
    This is not rendered correctly after showing the div
    <p:inputSwitch value="#{bean.booleanValue}"/>
</div>

Answer 1

组件通常在渲染时动态确定其大小。有时在javascript中，有时在css中。如果隐藏了父级，则它们的计算大小有时最终会为0（取决于计算方式或使用的css）。可能的解决方案：

• 您可以尝试例如在样式中或通过styleClass给它一个显式宽度。
• 更复杂的解决方案是绑定一个＆＃39; onShow＆＃39;在paren容器上的事件尝试调用init function of the inputSwitch