视图技术 - Thymeleaf 视图 - Thymeleaf 模板引擎

Java - Web - Spring 《视图技术 - Thymeleaf 视图 - Thymeleaf 模板引擎》

一、引言

在 Java Web 开发中，视图技术起着至关重要的作用，它负责将模型数据以友好的方式呈现给用户。Thymeleaf 作为一种现代化的服务器端 Java 模板引擎，正逐渐成为众多开发者的首选。与传统的 JSP 等视图技术相比，Thymeleaf 具有语法简洁、易于理解、支持 HTML 原型等诸多优点。本文将详细介绍 Thymeleaf 模板引擎在 Spring 框架中的使用。

二、Thymeleaf 简介

Thymeleaf 是一个用于处理和创建 XML/XHTML/HTML5 内容的 Java 模板引擎。它可以完全替代 JSP，并且在 Web 环境下表现出色。Thymeleaf 的核心优势在于它能够在不启动服务器的情况下查看模板文件，这大大提高了开发效率。它还支持与 Spring 框架无缝集成，为 Spring Web 应用提供了强大的视图支持。

三、Thymeleaf 与 Spring 集成步骤

1. 添加依赖

如果你使用的是 Maven 项目，在 pom.xml 中添加以下依赖：

<dependencies>
    <!-- Spring Boot Starter Thymeleaf -->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    <!-- Spring Boot Starter Web -->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
</dependencies>

2. 配置 Thymeleaf

在 Spring Boot 中，Thymeleaf 已经有了默认的配置，一般情况下不需要额外配置。但如果你需要自定义配置，可以在 application.properties 中进行修改：

# 开启 Thymeleaf 缓存，开发环境建议关闭
spring.thymeleaf.cache=false
# 模板文件的前缀
spring.thymeleaf.prefix=classpath:/templates/
# 模板文件的后缀
spring.thymeleaf.suffix=.html

3. 创建控制器

创建一个简单的 Spring MVC 控制器，用于处理请求并返回数据给视图：

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class HelloController {
    @GetMapping("/hello")
    public String hello(Model model) {
        model.addAttribute("message", "Hello, Thymeleaf!");
        return "hello";
    }
}

4. 创建 Thymeleaf 模板

在 src/main/resources/templates 目录下创建 hello.html 文件：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf Example</title>
</head>
<body>
    <h1 th:text="${message}">Default Message</h1>
</body>
</html>

5. 运行项目

启动 Spring Boot 应用程序，访问 http://localhost:8080/hello，你将看到页面上显示 Hello, Thymeleaf!。

四、Thymeleaf 常用语法

1. 文本替换

使用 th:text 指令可以将模型中的数据替换到 HTML 标签的文本内容中：

<p th:text="${user.name}">Default Name</p>

2. 属性赋值

使用 th:attr 指令可以为 HTML 标签的属性赋值：

<a th:href="@{/user/{id}(id=${user.id})}">View User</a>

3. 条件判断

使用 th:if 和 th:unless 指令可以进行条件判断：

<div th:if="${user.age > 18}">Adult User</div>
<div th:unless="${user.age > 18}">Minor User</div>

4. 循环遍历

使用 th:each 指令可以对集合进行循环遍历：

<table>
    <tr>
        <th>ID</th>
        <th>Name</th>
    </tr>
    <tr th:each="user : ${users}">
        <td th:text="${user.id}"></td>
        <td th:text="${user.name}"></td>
    </tr>
</table>

五、总结

Thymeleaf 模板引擎以其简洁的语法、强大的功能和良好的开发体验，成为了 Java Web 开发中视图技术的优秀选择。通过与 Spring 框架的无缝集成，开发者可以更加高效地构建出高质量的 Web 应用。以下是 Thymeleaf 常用语法的总结表格：

语法指令	功能描述	示例
`th:text`	文本替换	`<p th:text="${message}">Default Message</p>`
`th:attr`	属性赋值	`<a th:href="@{/user/{id}(id=${user.id})}">View User</a>`
`th:if`	条件判断（满足条件显示）	`<div th:if="${user.age > 18}">Adult User</div>`
`th:unless`	条件判断（不满足条件显示）	`<div th:unless="${user.age > 18}">Minor User</div>`
`th:each`	循环遍历	`<tr th:each="user : ${users}"><td th:text="${user.id}"></td></tr>`

希望通过本文的介绍，你对 Thymeleaf 模板引擎在 Spring 框架中的使用有了更深入的了解，能够在实际项目中灵活运用。