PrimeFaces 数据表 - f:facet 实际上在做什么？

Question

查看应用程序中的一些 PrimeFaces 代码时，我注意到以下行：

<f:facet name="header">#{trainSearch.trainCount} Trains</f:facet>

它似乎覆盖了 header，这是有道理的，但有人可以更详细地向我解释一下吗？

这行代码实际上发生了什么？

完整代码如下：

           <p:dataTable id = "results" value = "#{trainSearch.trains}" var = "train"     rendered="#{not empty trainSearch.trains}" styleClass = "train-search-table horizontal-border">
                <f:facet name="header">#{trainSearch.trainCount} Trains</f:facet> 
                <p:column headerText = "Train ID">
                    <p:panelGrid columns="1" styleClass = "train-id-grid" layout = "grid">
                        <h:outputText styleClass = "train-id-label" value="#{train.trainI}"/>
                        <h:outputText value="#{train.originCityState} > #{train.destinationCityState}" />
                    </p:panelGrid>
                </p:column>
                <p:column headerText="Scheduled Departure">
                    <h:outputText value="#{train.formattedScheduledDepartureText}" />
                </p:column>
                <p:column headerText="Scheduled Arrival">
                    <h:outputText value="#{train.formattedScheduledArrivalText}" />
                </p:column>
                 <p:column headerText="Loco Count">
                    <h:outputText value="#{train.locoCount}" />
                </p:column>
                <p:column headerText="Car Count">
                    <h:outputText value="#{train.carCount}" />
                </p:column>
            </p:dataTable>

Answer 1

JSF 中的 Facets 用于自定义组件的呈现，而无需触及其代码，例如数据表中的 header facet，您可以在其中将自定义代码放入数据表 header，而无需触及实际的 PrimeFaces 数据表代码。

DataTableRenderer（class 写入数据表的 html 代码）获取你放在一个方面的 xhtml 代码并将其呈现在 div.

您可以在 DataTableRenderer 的 encodeFacet 方法中看到这一点：

protected void encodeFacet(FacesContext context, DataTable table, UIComponent facet, String styleClass) throws IOException {
    if(facet == null)
        return;

    ResponseWriter writer = context.getResponseWriter();

    writer.startElement("div", null);
    writer.writeAttribute("class", styleClass, null);

    facet.encodeAll(context);

    writer.endElement("div");
}

行 facet.encodeAll(context); 在 RENDER_RESPONSE jsf 阶段将您放在 facet 中的代码呈现为 html。

PrimeFaces 数据表 - f:facet 实际上在做什么？

PrimeFaces Datatable - What is f:facet actually doing?

jsf

primefaces

jsf-2