正确使用Facelet模板&复合部件

时间:2012-04-07 16:06:56

标签: java jsf-2 custom-component composite-component tagfile

我仍然不确定正确使用JSF模板&复合部件。我需要创建一个企业Web应用程序,它将拥有大量页面。每个页面都有相同的标题,菜单,页脚,当然还有不同的内容(= JSF模板)。每个页面上的内容将由可重复使用的“框”(= JSF复合组件)组成。这些盒子包括一些文件,按钮等。我的解决方案是否合适?或者我应该使用其他技术,如自定义组件,装饰......?

layout.xhtml

<h:body>
    <ui:insert name="main_menu">
        <ui:include src="/xhtml/template/main_menu.xhtml"/>
    </ui:insert>
    <ui:insert name="header">
        <ui:include src="/xhtml/template/header.xhtml"/>
    </ui:insert>
    <ui:insert name="content"/>
    <ui:insert name="footer">
        <ui:include src="/xhtml/template/footer.xhtml"/>
    </ui:insert>
</h:body>

customer_overview.xhtml:

<html xmlns:cc="http://java.sun.com/jsf/composite/composite_component">
<h:body>
    <!-- Facelet template -->
    <ui:composition template="/xhtml/template/layout.xhtml">
        <ui:define name="content">
            <!-- Composite Components -->
            <cc:component_case_history
                caseList="#{customerOverviewController.cases}"
            />
            <cc:component_customer
                ....
            />
            ...
        </ui:define>
    </ui:composition>
</h:body>

component_case_history.xhtml

<html xmlns:composite="http://java.sun.com/jsf/composite">
<composite:interface>
    <composite:attribute name="cases" type="java.util.List"/>
</composite:interface>

<composite:implementation>
    <!-- using of "cases" -->
    ...
</composite:implementation>

CustomerOverviewController.java

@ManagedBean
@ViewScoped
public class CustomerOverviewController {
    public List<Case> getCases() {
        ...
    }
}

编辑2012-04-27

基于: When to use <ui:include>, tag files, composite components and/or custom components?

我认为我应该使用Facelet模板+ Facelet标签文件而不是Facelet模板+复合组件。

1 个答案:

答案 0 :(得分:6)

布局,模板

layout.xhtml:

  

每个页面都有相同的标题,菜单,页脚......

在这种情况下,您可以省略标题,菜单,页脚的ui:insert标记。

<h:body>
    <ui:include src="/xhtml/template/main_menu.xhtml"/>
    <ui:include src="/xhtml/template/header.xhtml"/>
    <ui:insert name="content"/>
    <ui:include src="/xhtml/template/footer.xhtml"/>
</h:body>

你也可能有一个没有名字的ui:insert,所以如果你想进一步简化:

<h:body>
    <ui:include src="/xhtml/template/main_menu.xhtml"/>
    <ui:include src="/xhtml/template/header.xhtml"/>
    <ui:insert/>
    <ui:include src="/xhtml/template/footer.xhtml"/>
</h:body>

customer_overview.xhtml:

如果你有ui:在layout.xhtml中没有名字插入,你不需要ui:define here:

<ui:composition template="/xhtml/template/layout.xhtml">
        <!-- Composite Components -->
        <cc:component_customer/>
        <cc:component_case_history
            caseList="#{customerOverviewController.cases}"
        />
        ...
</ui:composition>

此外,您应将模板放在用户无法直接访问的文件夹中(WEB-INF)。

可重复使用的“盒子”

您的一个复合组件如下所示:

<cc:component_customer/>

没有任何属性的组件非常可疑。

  • 它做什么?
  • 显示用户名?
  • 如果您没有传递任何属性,它如何获取用户名?

组件应该是独立的,对于其他可重用的部件,请使用ui:insert。