Как работает макет тимелеафа: декоратор

Я столкнулся с фрагментом кода в проекте springboot (1.3.2) - thymeleaf (2.1.4) - диалект макета тимелеафа (1.3.1), над которым я работаю, где содержится html-файл содержимого:

<html xmlns:th="http://www.thymeleaf.org" layout:decorator="layout/sitelayout">
...

<div th:fragment="content" class="container">
....
</div>

And the sitelayout.html file contains:

<div layout:fragment="content">
    <h1>Static content for prototyping purposes only</h1>

    <p>
        This is the layout of the site. The actual content will come from individual views making use of this layout
    </p>
</div>

===================================================

Я искал в Интернете и не смог найти достаточно информации / примера документации о том, как это работает. Может ли кто-нибудь указать мне правильное направление?


spring-boot thymeleaf
person Upol    schedule 15.09.2017    source источник
comment
действительно хороший вопрос! Почему так мало лайков?!?   -  person Nighel    schedule 07.05.2020

Ответы (4)


arrow_upward
2
arrow_downward

Подробное описание:

Вы знаете, что Thymeleaf — это механизм шаблонов, в котором используются несколько концепций:

  • Шаблон.
     Шаблон – это понятие, означающее, что вы можете писать свои HTML-файлы в более широком смысле (возможно, включая другие шаблоны). Эти файлы шаблонов, наконец, будут обработаны механизмом шаблонов Thymeleaf на стороне сервера и создадут обычный html-файл, который будет отправлен клиенту.
  • Макет (общая концепция):
    Макет — это расположение текста, изображений и других объектов на странице, и это больше всего интересует дизайнеров веб-сайтов. По концепции макета вы можете указать общую структуру/форматирование ваших страниц. Файлы макета могут быть без содержимого (только структура) или с некоторым содержимым, которое используется его вызывающими объектами.
  • Шаблон макета (= макет страницы):
    Шаблон макета — это файл макета с несколькими фрагментами и пустыми тегами, поэтому вызывающие макеты (шаблоны страниц) вызывают его и используют его структуру (в то время как сами также иметь содержание).
  • Шаблон страницы
    Шаблон страницы относится к html-файлу страницы, поэтому он может вызывать другие шаблоны и фрагменты и использовать структуру шаблона макета. Наконец, шаблон страницы будет преобразован в обычную html-страницу механизмом шаблонов Thymeleaf.
  • Фрагмент.
     Фрагмент является частью шаблона. Thymeleaf позволяет импортировать фрагменты шаблона в другой шаблон.

Обычно разработчики создают несколько шаблонов макета (для разных форматов страниц), которые используются в других шаблонах страниц. Шаблоны макета/страницы часто содержат некоторые фрагменты, такие как верхний колонтитул, навигация, нижний колонтитул и основной раздел, в котором будет размещаться основное содержимое.

Теперь, что такое диалект? Как вы знаете, Thymeleaf — это инструмент, позволяющий настраивать его, и для этой цели диалект позволяет вам определить, как будет обрабатываться ваш шаблон. На самом деле Layout dialect выполняет оформление в соответствии с шаблоном декоратора.

Разные диалекты:

  1. Базовая библиотека Thymeleaf предоставляет диалект под названием Стандартный
    диалект    , который подходит для всех и использует язык OGNL
    для обработки шаблона.
  2. Spring Framework создает частный диалект под названием SpringStandard Dialect. он похож на стандартный диалект Thymeleaf, но имеет небольшие изменения для лучшего использования некоторых функций Spring Framework. Например: он использует Spring Expression Language (SpringEL) вместо OGNL. Поэтому, если вы используете Spring Framework, вы должны использовать этот диалект.
  3. thymeleaf-layout-dialect : с открытым исходным кодом project и имеет больше функций, позволяющих создавать макеты и повторно используемые шаблоны для улучшения повторного использования кода. Эта библиотека использует префикс layout: для своих атрибутов.
  4. Пользовательский диалект: вы можете расширить Thymeleaf и создать свой собственный диалект.

Пример: Проект загрузки тимелеафа в spring с диалектом тимелеафа-раскладки (диалект номер 3):

 <dependency>
         <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>nz.net.ultraq.thymeleaf</groupId>
            <artifactId>thymeleaf-layout-dialect</artifactId>
        </dependency>
 </dependency>

Примечание. Причина декоратора ИЛИ декорирования в диалекте номер (3):
Диалект макета Thymeleaf версия 1.x использует decorator, который был напротив decorator pattern.
Таким образом, в версии 2.x эта ошибка была устранена путем введения decorate.
Поэтому, несмотря на то, что Thymeleaf и его библиотеки диалектов компоновки обратно совместимы , но лучше использовать layout:decorate в своих кодах.

В то время как диалект макета выполняет оформление в соответствии с шаблоном декоратора, в версии 1.x он неправильно идентифицировал макет/родительский шаблон как декоратор, когда вместо этого, согласно шаблону проектирования, расширение (шаблон контента в данном случае) является декоратором. . Это изменение представляет собой простое переименование обработчика layout:decorator/data-layout-decorator в layout:decorate/data-layout-decorate так, чтобы определяемый шаблон был декорируемым, а не декоратором, плюс капитальный ремонт документации. исправить это несоответствие.
ссылка: https://ultraq.github.io/thymeleaf-layout-dialect/MigrationGuide.html
Итак, вы должны использовать layout:decorate в своих шаблонах страниц и сослаться на основной шаблон.
В layout:decorate в теге указано, какой шаблон макета использовать для украшения с помощью этот шаблон контента


Пример: https://ultraq.github.io/thymeleaf-layout-dialect/Examples.html#layouts

person Ghasem Sadeghi    schedule 28.02.2020

arrow_upward
1
arrow_downward

Я думаю, наконец, я нашел хороший учебник о шаблоне макета тимелеафа с диалектом макета здесь: https://medium.com/@trevormydata/week-5-thymeleaf-with-spring-mvc-rapid-introduction-to-the-essentials-799f1fba8c07

Процессор layout:decorator использовался в более ранней версии тимелеафа ( https://github.com/ultraq/thymeleaf-layout-dialect/tree/master-thymeleaf-2.1). В последней версии используется layout:decorate, поэтому мне было сложно получить документацию по layout:decorator.

person Upol    schedule 15.09.2017

arrow_upward
0
arrow_downward

У меня есть информация, которая должна ответить на ваш вопрос, как работать с этим кодом. К вашему сведению, я считаю, что код должен указывать layout:decorate вместо layout:decorator в теге HTML.

Основное описание диалекта макета

[...]Layout Dialect дает людям возможность использовать иерархический подход[...]. Диалект макета Thymeleaf использует шаблоны макета/декоратора для оформления содержимого, а также может передавать целые элементы фрагмента на включенные страницы. [...]

Ссылки

Документация Thymeleaf по макету

  • Перейдите к номеру 4, чтобы прочитать конкретно о layout:decorate.

учебник Baeldung по использованию макета Thymeleaf.

Надеюсь это поможет.

person Michael C Good    schedule 15.09.2017

arrow_upward
0
arrow_downward

Обычно веб-сайты имеют общие компоненты страницы, такие как верхний и нижний колонтитулы, меню и, возможно, многие другие. Эти компоненты страницы могут использоваться одним и тем же или разными макетами. Существует два основных стиля организации макетов в проектах: включаемый стиль и иерархический стиль. Оба стиля можно легко использовать с Thymeleaf, не теряя при этом своей самой большой ценности: естественных шаблонов.

Источник: http://www.thymeleaf.org/doc/articles/layouts.html< /а>

person Zeusox    schedule 05.02.2018