JSF 2: Как правильно строить компоненты? - PullRequest
Новая
       0

JSF 2: Как правильно строить компоненты?

1 голос
/ 27 июля 2011

Я новичок в 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 не работают должным образом, когда я пытаюсь импортировать эти файлы?

Это то, что я пытаюсь сделать лучший подход?

С наилучшими пожеланиями, Вальтер Энрике.

1 Ответ

4 голосов
/ 27 июля 2011

В 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 или через специальные страницы Facelets, называемые composite-components. Составные компоненты в основном объединяют ряд существующих компонентов и разметку для формирования новых компонентов, которые можно легко использовать повторно. Например. очень простой составной компонент без параметров: 

<?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/>. Э.Г. 

<?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>

Иногда includes и composite components и третий вариант facelets tags могут чувствовать себя немного похожими друг на друга. В общем, вы должны использовать include для вещей, которые в основном очень специфичны для отдельной страницы, и компоненты для вещей, которые вы повторно используете во многих местах. Разница между composite components и facelets tags более тонкая, но во многих случаях composite components можно считать более современным вариантом.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...