Spring Boot使用Thymeleaf实现的案例

1. 概述

本文将介绍如何使用Spring Boot和Thymeleaf来实现一个简单的案例。我们将以一个学生列表的展示页面为例，通过Thymeleaf来渲染页面，并在后台使用Spring Boot来处理请求和返回数据。

2. 整体流程

下面是整个实现过程的流程图表：

journey
    title Spring Boot使用Thymeleaf实现的案例流程

    section 创建项目
        创建Spring Boot项目并引入相关依赖

    section 创建实体类
        创建学生实体类，包含学生的姓名和年龄属性

    section 创建控制器
        创建控制器类，处理请求和返回数据

    section 创建视图模板
        创建Thymeleaf视图模板文件，用于渲染页面

    section 配置视图解析器
        配置Spring Boot的视图解析器，将Thymeleaf视图模板与控制器关联起来

    section 运行程序
        启动Spring Boot应用程序并访问学生列表页面

3. 具体步骤

3.1 创建项目

首先，我们需要创建一个Spring Boot项目，并引入相关依赖。可以使用IDEA等工具创建一个新的Spring Boot项目，或使用Spring Initializer网站来生成项目骨架。

在项目的pom.xml文件中添加Thymeleaf和Spring Boot的相关依赖：

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

    <!-- Thymeleaf -->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
</dependencies>

3.2 创建实体类

接下来，创建一个简单的学生实体类。学生实体类包含学生的姓名和年龄属性：

public class Student {
    private String name;
    private int age;

    // 省略构造方法、getter和setter方法
}

3.3 创建控制器

创建一个控制器类，用于处理请求和返回数据。在控制器类中，我们可以通过@GetMapping注解来映射一个GET请求，并返回一个包含学生数据的Model对象：

@Controller
public class StudentController {
    @GetMapping("/students")
    public String getStudents(Model model) {
        List<Student> students = new ArrayList<>();
        // 假设从数据库或其他数据源中获取学生数据
        students.add(new Student("张三", 20));
        students.add(new Student("李四", 22));
        students.add(new Student("王五", 18));

        model.addAttribute("students", students);
        return "student-list";
    }
}

3.4 创建视图模板

创建一个Thymeleaf视图模板文件，用于渲染学生列表页面。在该文件中，我们可以使用Thymeleaf的语法来动态渲染页面。

在项目的src/main/resources/templates目录下创建一个名为student-list.html的文件，内容如下：

<!DOCTYPE html>
<html xmlns:th="
<head>
    <meta charset="UTF-8">
    <title>学生列表</title>
</head>
<body>
    学生列表
    <table>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
        </tr>
        <tr th:each="student : ${students}">
            <td th:text="${student.name}"></td>
            <td th:text="${student.age}"></td>
        </tr>
    </table>
</body>
</html>

3.5 配置视图解析器

在Spring Boot应用程序的配置类中，我们需要配置一个视图解析器，将Thymeleaf视图模板与控制器关联起来。

@Configuration
public class MvcConfig implements WebMvcConfigurer {
    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/students").setViewName("student-list");
    }
}

3.6 运行程序

最后，我们可以启动Spring Boot应用程序，并访问学生列表页面。