jsf - 具有复合组件作为选项卡的 Primefaces TabView

Question

我想使用 PrimeFaces TabView 组件在选项卡中显示来 self 们服务器的数据。我需要三个选项卡来显示具有不同数据的三个表。

如果我这样写就可以了:

<p:tabView>
  <p:tab>
    // <p:dataTable> logic comes here
  </p:tab>
  <p:tab>
    // and here
  </p:tab>
</p:tabView>

我的问题是每个选项卡的 dataTable 逻辑或多或少是相同的。我不喜欢这种代码重复，所以我想创建一个像这样工作的自定义选项卡:

总结.xhtml

<p:tabView>
  <my:customTab dataToDisplay="#{myBean.dataSet1}">
  <my:customTab dataToDisplay="#{myBean.dataSet2}">
</p:tabView>

但到目前为止，我还没有成功实现一个有效的复合组件。我的方法是用这段代码创建一个单独的 customTab.xhtml 文件

自定义标签.xhtml

<ui:composition // namespace definitions
    ... >
  <composite:interface>
    <composite:attribute name="dataToDisplay" />
  </composite:interface>
  <composite:implementation>
    <p:tabView>
      // dataTable logic comes here
    </p:tabView>
  </composite:implementation>
</ui:composition>

但是 tabView 组件不显示任何选项卡。这可能是因为 JSF 将为每个 my:customTab-Tag 绘制一个单独的组件。这样 tabView 将看不到 my:customTab 中有一个 p:tab。我需要做什么才能使 TabView 识别 my:customTab 中的 p:tab ？

Answer 1

    <p:tabView>
      <p:tab>
          <ui:include src="datatabletemplate.xhtml">
             <ui:param name="data" value="#{data1}"/>
          </ui:include>
      </p:tab>
      <p:tab>
        <ui:include src="datatabletemplate.xhtml">
             <ui:param name="data" value="#{data2}"/>
          </ui:include>
      </p:tab>
      <p:tab>
         <ui:include src="datatabletemplate.xhtml">
             <ui:param name="data" value="#{data3}"/>
          </ui:include>
      </p:tab>
    </p:tabView>

我认为这是解决问题的快速简便方法。如果没有自定义组件，#{data1} 可以是整个 bean 或只是数据表的值(或者您也可以添加更多参数)