Question

我正在使用PrimeFaces 5，我想创建类似这样的东西

-----------------------------
| HEADER                     |
-----------------------------
|       USER IMAGE           |
-----------------------------|
|    Key        |    Value   |
-----------------------------
|    Key        |    Value   |
-----------------------------
|    Key        |    Value   |
-----------------------------

所以我拥有的是

<p:panelGrid columns="2">
        <f:facet name="header">
            <p:column colspan="2">User Profile</p:column>
        </f:facet>

        <h:outputText value="User ID"/>
        <h:outputText value="#{fitbitAuthResponseMB.userProfile.userId}"/>
</p:panelGrid>

我尝试使用<p:row>这样的

<p:panelGrid columns="2">
        <f:facet name="header">
            <p:column colspan="2">User Profile</p:column>
        </f:facet>

        <p:row>
           <p:column colspan="2">
               <h:graphicImage value=".."/>
           </p:column>
        </p:row>

        <p:row>
           <p:column>

               <h:outputText value="User ID"/>
           </p:column>
           <p:column>
        <h:outputText value="#{fitbitAuthResponseMB.userProfile.userId}"/>
           </p:column>
        </p:row>
</p:panelGrid>

但它没有像我预期的那样起作用。

我的代码做了什么

-----------------------------
| HEADER       | USER IMAGE  |
-----------------------------
|    Key        |    Value   |
-----------------------------
|    Key        |    Value   |
-----------------------------
|    Key        |
-----------------

Answer 1

我不知道为什么，但似乎如果你想使用p：row，你必须使用p：row和p：column定义所有行和列。所以你不能使用属性＆＃34; columns＆＃34; p：panelGrid。试试这个：

<p:panelGrid >
    <f:facet name="header">
     <p:row>
        <p:column colspan="2">User Profile</p:column>
        </p:row>
    </f:facet>

    <p:row>
       <p:column colspan="2">
           <h:graphicImage value=".."/>
       </p:column>
    </p:row>

    <p:row>
       <p:column>

           <h:outputText value="User ID"/>
       </p:column>
       <p:column>
    <h:outputText value="#{fitbitAuthResponseMB.userProfile.userId}"/>
       </p:column>
    </p:row></p:panelGrid>

在p：panelGrid中对列进行分组

1 个答案: