Spring Boot整合Thymeleaf小项目及详细流程

本文将介绍如何使用Spring Boot整合Thymeleaf模板引擎，以及详细的流程和示例。

什么是Thymeleaf

Thymeleaf是一种现代化的服务器端Java模板引擎，它可以处理HTML、XML、JavaScript、CSS甚至纯文本。它的主要目标是为Web和独立环境创建优雅的自然模板。

Spring Boot整合Thymeleaf的步骤

下面是Spring Boot整合Thymeleaf的步骤：

添加Thymeleaf依赖

在pom.xml文件中添加以下依赖：

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

配置Thymeleaf

在application.properties文件中添加以下配置：

# Thymeleaf
spring.thymeleaf.cache=false
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML
spring.thymeleaf.encoding=UTF-8

在上面的配置中，我们禁用了Thymeleaf的缓存，并指定了模板文件的位置和后缀名。

创建Thymeleaf模板

在src/main/resources/templates目录下创建一个名为index.html的模板文件，内容如下：

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

在上面的模板中，我们使用了Thymeleaf的语法来显示一个变量。

创建Controller

创建一个名为HelloController的控制器类，代码如下：

@Controller
public class HelloController {
    @GetMapping("/")
    public String index(Model model) {
        model.addAttribute("message", "Hello, Thymeleaf!");
        return "index";
    }
}

在上面的控制器中，我们使用了@GetMapping注解来处理根路径的请求，并将一个名为message的变量添加到模型中。

运行应用程序

运行应用程序，并访问http://localhost:8080/，应该可以看到“Hello, Thymeleaf!”的文本。

示例一：使用Thymeleaf显示列表

下面是一个示例，演示如何使用Thymeleaf显示一个列表：

创建一个名为User的实体类：

public class User {
    private Long id;
    private String name;
    private Integer age;

    // 省略getter和setter方法
}

在上面的示例中，我们创建了一个名为User的实体类，并定义了id、name和age属性。

创建一个名为UserController的控制器类：

@Controller
public class UserController {
    @GetMapping("/users")
    public String list(Model model) {
        List<User> users = new ArrayList<>();
        users.add(new User(1L, "张三", 20));
        users.add(new User(2L, "李四", 25));
        users.add(new User(3L, "王五", 30));
        model.addAttribute("users", users);
        return "user/list";
    }
}

在上面的示例中，我们创建了一个名为UserController的控制器类，并使用@GetMapping注解来处理/users路径的请求。我们还创建了一个名为users的列表，并将其添加到模型中。

创建一个名为list.html的模板文件：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>User List</title>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Age</th>
            </tr>
        </thead>
        <tbody>
            <tr th:each="user : ${users}">
                <td th:text="${user.id}"></td>
                <td th:text="${user.name}"></td>
                <td th:text="${user.age}"></td>
            </tr>
        </tbody>
    </table>
</body>
</html>

在上面的模板中，我们使用了Thymeleaf的语法来显示一个名为users的列表。

运行应用程序

运行应用程序，并访问http://localhost:8080/users，应该可以看到一个包含三个用户信息的表格。

示例二：使用Thymeleaf处理表单

下面是一个示例，演示如何使用Thymeleaf处理表单：

创建一个名为UserForm的表单类：

public class UserForm {
    private String name;
    private Integer age;

    // 省略getter和setter方法
}

在上面的示例中，我们创建了一个名为UserForm的表单类，并定义了name和age属性。

创建一个名为UserController的控制器类：

@Controller
public class UserController {
    @GetMapping("/user")
    public String form(Model model) {
        model.addAttribute("userForm", new UserForm());
        return "user/form";
    }

    @PostMapping("/user")
    public String submit(@ModelAttribute UserForm userForm) {
        System.out.println(userForm.getName());
        System.out.println(userForm.getAge());
        return "redirect:/user";
    }
}

在上面的示例中，我们创建了一个名为UserController的控制器类，并使用@GetMapping注解来处理/user路径的请求。我们还创建了一个名为userForm的表单，并将其添加到模型中。在提交表单时，我们使用@PostMapping注解来处理请求，并使用@ModelAttribute注解来绑定表单数据。

创建一个名为form.html的模板文件：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>User Form</title>
</head>
<body>
    <form th:action="@{/user}" th:object="${userForm}" method="post">
        <div>
            <label>Name:</label>
            <input type="text" th:field="*{name}">
        </div>
        <div>
            <label>Age:</label>
            <input type="text" th:field="*{age}">
        </div>
        <div>
            <button type="submit">Submit</button>
        </div>
    </form>
</body>
</html>

在上面的模板中，我们使用了Thymeleaf的语法来创建一个表单，并绑定表单数据。

运行应用程序

运行应用程序，并访问http://localhost:8080/user，应该可以看到一个包含两个输入框和一个提交按钮的表单。在提交表单后，应该可以在控制台中看到表单数据的输出。

结束语

在本文中，我们介绍了如何使用Spring Boot整合Thymeleaf模板引擎，并提供了两个示例。这些技巧可以帮助您更好地理解Thymeleaf的使用方法，并提高开发效率。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：SpringBoot整合Thymeleaf小项目及详细流程 - Python技术站

SpringBoot整合Thymeleaf小项目及详细流程

Spring Boot整合Thymeleaf小项目及详细流程

什么是Thymeleaf

Spring Boot整合Thymeleaf的步骤

示例一：使用Thymeleaf显示列表

示例二：使用Thymeleaf处理表单

结束语

相关文章