以下是一个完整的 Spring Boot + Thymeleaf 整合示例，包含项目结构、代码和运行说明：
1. 项目依赖配置（Maven）
在 pom.xml 中添加 Thymeleaf 依赖：
<dependencies>
<!-- Spring Boot Web Starter -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- Thymeleaf Starter -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!-- Spring Boot DevTools (可选，用于热更新) -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<scope>runtime</scope>
</dependency>
</dependencies>
2. 项目结构
src/
├── main/
│ ├── java/
│ │ └── com.example.demo/
│ │ ├── DemoApplication.java // 启动类
│ │ └── controller/ // 控制器包
│ │ └── HelloController.java // 示例控制器
│ └── resources/
│ ├── static/ // 静态资源（CSS/JS）
│ ├── templates/ // Thymeleaf 模板文件
│ │ └── hello.html // 示例模板
│ └── application.properties // 配置文件（可选）
└── test/
└── ... // 测试代码
3. 启动类（DemoApplication.java）
package com.example.demo;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class DemoApplication {
public static void main(String[] args) {
SpringApplication.run(DemoApplication.class, args);
}
}
4. 控制器（HelloController.java）
package com.example.demo.controller;
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("name", "Thymeleaf");
model.addAttribute("users", new String[]{"Alice", "Bob", "Charlie"});
return "hello"; // 对应 templates/hello.html
}
}
5. Thymeleaf 模板（hello.html）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Thymeleaf Example</title>
</head>
<body>
<h1 th:text="'Hello, ' + ${name} + '!'">Default Text</h1>
<!-- 条件判断 -->
<p th:if="${users.size() > 0}">Users list:</p>
<ul>
<!-- 遍历用户列表 -->
<li th:each="user : ${users}" th:text="${user}"></li>
</ul>
<!-- 表单示例 -->
<form action="#" th:action="@{/submit}" method="post">
<input type="text" th:field="*{username}" placeholder="Enter name">
<button type="submit">Submit</button>
</form>
</body>
</html>
6. 配置（application.properties 可选）
# Thymeleaf 配置（可选，默认配置已足够）
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.cache=false # 开发时关闭缓存
7. 运行与验证
- 启动应用：运行
DemoApplication的main方法。 - 访问
http://localhost:8080/hello，页面显示：- 标题：
Hello, Thymeleaf! - 用户列表：Alice, Bob, Charlie
- 表单输入框
- 标题：
关键点总结
| 功能 | 实现方式 |
|---|---|
| 模板路径 | src/main/resources/templates/ 目录下的 HTML 文件，后缀为 .html 或 .xhtml |
| 数据绑定 | 通过 Model 对象传递数据到模板，使用 ${variable} 语法引用变量 |
| 条件渲染 | th:if, th:unless 控制元素显示 |
| 循环遍历 | th:each 遍历集合数据 |
| 表单绑定 | th:field 自动绑定表单字段到后端对象 |
扩展示例：带表单提交的控制器
@Controller
public class FormController {
@GetMapping("/form")
public String showForm(Model model) {
model.addAttribute("user", new User()); // 表单对象
return "form";
}
@PostMapping("/submit")
public String submitForm(@ModelAttribute User user) {
// 处理提交数据
return "redirect:/success";
}
}
对应的表单模板 form.html：
<form th:object="${user}" action="#" th:action="@{/submit}" method="post">
<input type="text" th:field="*{name}" placeholder="Name">
<input type="email" th:field="*{email}" placeholder="Email">
<button type="submit">Submit</button>
</form>