JSF 2:如何正确构建组件?

时间:2011-07-27 14:06:27

标签: java templates jsf jsf-2

我是JSF的新手,我正在努力学习它,因为我看到了它的好处。 我有一个用HTML构建的网站,现在我想创建一些部分的模板,比如<head>部分,侧边栏,顶部菜单,页脚等。我了解到在JSF中这些将被称为“组件”。

这将是这样的,例如:

<html>
    <h:head>
        <title>Example</title>
        <ui:include src="/resources/component/head.xhtml"></ui:include>
    </h:head>
    <h:body>
    //....
    <ui:include src="/resources/component/footer.xhtml"></ui:include>    
    </h:body>
</html>

我已经尝试过做类似上面的事情,但我的.css风格并不适用于我的div。 javascript文件同样适用。

我想将所有内容传递给JSF。我想知道这样做是否值得。你们觉得怎么样?

在JSF中创建模板和组件的最佳方法是什么,当我尝试导入这些文件时,为什么我的样式和javascript无法正常工作?

我正在尝试做最好的方法吗?

祝你好运, Valter Henrique。

1 个答案:

答案 0 :(得分:4)

在JSF中,有模板和组件。组件不是模板的另一个词。

您展示的示例不太可能是组件的候选者,但实际上是由(Facelets)模板完成的:

<html xmlns="http://www.w3.org/1999/xhtml"    
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <title>Example</title>
        <ui:include src="/resources/component/head.xhtml"/>
    </h:head>
    <h:body>
        <ui:insert name="content"/>    
        <ui:include src="/resources/component/footer.xhtml"/>
    </h:body>
</html>

现在各个页面可以使用此模板,然后调用template clients

<?xml version="1.0" encoding="UTF-8"?> 

<ui:composition
    xmlns:ui="http://java.sun.com/jsf/facelets"     
    template="/templates/master.xhtml">

    <ui:define name="content">
        Some content for this page.
    </ui:define>
</ui:composition>

注意模板中名为content的部分的定义,模板客户端为其提供实际内容。

Components可以通过Java或名为composite-components的特殊Facelets页面创建。复合组件基本上组合了许多现有组件和标记,以形成可以轻松重复使用的新组件。例如。一个非常简单的复合组件,没有任何参数:

<?xml version="1.0" encoding="UTF-8"?> 

<ui:composition
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:cc="http://java.sun.com/jsf/composite"
>
    <cc:interface/>

    <cc:implementation>    
        <p>
            <h:outputText value="&amp;nbsp;" escape="false"/>
        </p>        
    </cc:implementation>

</ui:composition>

如果您将其放在[web content]/resources/foo/emptyLine.xhtml中,则可以在模板上将其用作<foo:emptyLine/>。 E.g。

<?xml version="1.0" encoding="UTF-8"?> 

<ui:composition
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:m4n="http://java.sun.com/jsf/composite/foo"
    template="/templates/master.xhtml">

    <ui:define name="content">
        Some content for this page.
        <foo:emptyLine/>
    </ui:define>
</ui:composition>

有时includescomposite components以及第三个变体facelets tags会感觉彼此有点相似。通常,您将使用包含基本上非常特定于单个页面的内容和用于在许多位置重复使用的内容的组件。 composite componentsfacelets tags之间的差异更为微妙,但在许多情况下,composite components可以被认为是两者中更现代的变体。