Работа с перечислениями в Thymeleaf

1. Введение

В этом кратком руководстве мы узнаем, как работать с перечислениями в Thymeleaf .

Мы начнем с перечисления значений перечисления в раскрывающемся списке. После этого мы рассмотрим использование нашего перечисления для управления потоком данных в наших шаблонах.

2. Настройка

Давайте начнем с добавления стартера Spring Boot для Thymeleaf в наш файл pom.xml :

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
    <versionId>2.2.2.RELEASE</versionId>
</dependency>

Мы будем работать с виджетами, у которых есть несколько вариантов цвета, поэтому давайте определим наше перечисление Color :

public enum Color {
    BLACK, BLUE, RED, YELLOW, GREEN, ORANGE, PURPLE, WHITE
}

Теперь давайте создадим наш класс Widget :

public class Widget {
    private String name;
    private Color color;

    // Standard getters/setters
}

3. Отображение перечислений в раскрывающемся меню

Давайте используем select и option для создания раскрывающегося списка, в котором используется наше перечисление Color :

<select name="color">
    <option th:each="colorOpt : ${T(com.foreach.thymeleaf.model.Color).values()}" 
        th:value="${colorOpt}" th:text="${colorOpt}"></option>
</select>

Оператор T является частью языка выражений Spring для указания экземпляра класса или доступа к статическим методам.

Если мы запустим наше приложение и перейдем на страницу ввода нашего виджета, мы увидим все наши цвета в раскрывающемся списке « Цвет »:

Когда мы отправим нашу форму, наш объект Widget будет заполнен выбранным цветом:

4. Использование отображаемого имени

Так как все заглавные буквы могут немного раздражать, давайте расширим наш пример, чтобы создать более удобные раскрывающиеся метки.

Мы начнем с изменения нашего перечисления Color , чтобы предоставить отображаемое имя:

public enum Color {
    BLACK("Black"), 
    BLUE("Blue"), 
    RED("Red"), 
    YELLOW("Yellow"), 
    GREEN("Green"),
    ORANGE("Orange"), 
    PURPLE("Purple"), 
    WHITE("White");
    
    private final String displayValue;
    
    private Color(String displayValue) {
        this.displayValue = displayValue;
    }
    
    public String getDisplayValue() {
        return displayValue;
    }
}

Затем давайте перейдем к нашему шаблону Thymeleaf и обновим раскрывающийся список, чтобы использовать новое displayValue :

<select name="color">
    <option th:each="colorOpt : ${T(com.foreach.thymeleaf.model.Color).values()}" 
        th:value="${colorOpt}" th:text="${colorOpt.displayValue}"></option>
</select>

Наш раскрывающийся список теперь отображается с более читаемыми названиями цветов:

5. Операторы if

Иногда мы можем захотеть изменить то, что мы показываем, на основе значений перечисления. Мы можем использовать наше перечисление Color с условными операторами Thymeleaf .

Давайте представим, что у нас есть мнения о некоторых возможных цветах виджета.

Мы можем использовать оператор Thymeleaf if с нашим перечислением Color для условного отображения текста:

<div th:if="${widget.color == T(com.foreach.thymeleaf.model.Color).RED}">
    This color screams danger.
</div>

Другой вариант - использовать сравнение строк :

<div th:if="${widget.color.name() == 'GREEN'}">
    Green is for go.
</div>

6. Операторы Switch-Case

В дополнение к операторам if Thymeleaf поддерживает оператор switch-case .

Давайте используем оператор switch-case с нашим перечислением Color :

<div th:switch="${widget.color}">
    <span th:case="${T(com.foreach.thymeleaf.model.Color).RED}"
      style="color: red;">Alert</span>
    <span th:case="${T(com.foreach.thymeleaf.model.Color).ORANGE}"
      style="color: orange;">Warning</span>
    <span th:case="${T(com.foreach.thymeleaf.model.Color).YELLOW}"
      style="color: yellow;">Caution</span>
    <span th:case="${T(com.foreach.thymeleaf.model.Color).GREEN}"
      style="color: green;">All Good</span>
</div>

Если мы введем оранжевый виджет, мы должны увидеть предупреждение:

7. Заключение

В этом руководстве мы начали с использования Thymeleaf для создания раскрывающегося списка с использованием перечисления Color , которое мы определили в нашем приложении. Оттуда мы узнали, как сделать выпадающие отображаемые значения более читабельными.

После прохождения стороны ввода с помощью раскрывающегося списка мы перешли к стороне вывода и узнали, как работать с перечислениями в управляющих структурах. Мы использовали операторы if и switch-case для обработки некоторых элементов на основе нашего перечисления Color .

Полный пример доступен на GitHub .