Sure，下面我会详细讲解“详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎”的完整攻略。

简介

Thymeleaf 是一个用于 Web 与独立环境的现代服务器端 Java 模板引擎。Thymeleaf 的主要目标是提供一种优雅和高度可维护的创建 XHTML / HTML5 的模板的方式；同时也可以非常轻松地拓展为JSP等模板引擎，或者作为XML、JSON等文件的定义语言。它与Spring Boot完美集成，Spring Boot官方文档已经推荐使用，当前版本为2.5.2.

如何使用Thymeleaf

Thymeleaf和其他模板引擎一样，需要将被渲染的内容放到模板文件中。下面是一个简单的例子：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Example Page</title>
</head>
<body>
    <h1>Welcome to example page!</h1>

    <p th:text="'The time is:' + ${#dates.format(new java.util.Date(), 'yyyy-MM-dd HH:mm:ss')}""></p>
</body>
</html>

在上面的例子中，我们使用th这个命名空间定义了一个th:text属性。这意味着该标签将被用于渲染文本。'The time is:' + ${#dates.format(new java.util.Date(), 'yyyy-MM-dd HH:mm:ss')}这个表达式将在运行时求值并显示在标签内部。

在接下来的两个示例中，我们将展示如何使用Thymeleaf渲染一个简单的列表和一个表单。

示例一：渲染一个简单的列表

我们将首先创建一个控制器，以提供一些数据供我们在列表中渲染。

@Controller
public class UserController {
    @GetMapping("/users")
    public String getUsers(Model model) {
        List<User> userList = Arrays.asList(new User("张三", 20), new User("李四", 25), new User("王五", 30));
        model.addAttribute("users", userList);
        return "users";
    }
}

在上面的代码中，当我们收到请求/users时，我们将会返回一个名为users的视图。我们在视图中将使用model.addAttribute方法向模型中添加用户列表数据。

接下来我们需要为该视图编写一个Thymeleaf模板（即users.html）：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Users</title>
</head>
<body>
    <h1>用户列表</h1>
    <table>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
        </tr>
        <tr th:each="user : ${users}">
            <td th:text="${user.name}"></td>
            <td th:text="${user.age}"></td>
        </tr>
    </table>
</body>
</html>

在上面的例子中，我们使用了Thymeleaf的th:each属性，它让我们在模板中迭代一个列表，并为列表中的每个元素创建一个

元素。

示例二：渲染一个表单

在这个示例中，我们将向用户展示一个表单，用户可以在表单中输入数据，并将该数据提交到控制器中进行处理。为了实现这个功能，我们需要做如下几个步骤。

首先是控制器：

@Controller
public class FormController {
    @GetMapping("/form")
    public String showForm(User user) {
        return "form";
    }

    @PostMapping("/form")
    public String processForm(User user, Model model) {
        model.addAttribute("user", user);
        return "result";
    }
}

在上面的代码中，我们首先定义一个showForm方法，在该方法中，我们返回了一个form的视图，这个视图将展示一个表单，用户可以在表单中输入数据。当用户提交表单时，将会调用processForm方法，并向其中传递用户提交的数据。在该方法中，我们使用了model.addAttribute方法将该用户模型添加到模型中，并返回一个名为result的视图。

接下来是表单视图，即form.html：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Form</title>
</head>
<body>
    <form action="#" th:action="@{/form}" th:object="${user}" method="post">
        <p>姓名：<input type="text" th:field="*{name}" /></p>
        <p>年龄：<input type="text" th:field="*{age}" /></p>
        <input type="submit" value="提交" />
    </form>
</body>
</html>

在上面的代码中，我们使用了th:action属性来指定表单的提交地址，它将被映射到控制器的/form路径上。我们同时使用了th:object属性来托管该表单数据对象，该属性将与th:field属性搭配使用，以渲染HTML元素和该元素的值。

在提交表单后，我们将渲染result视图，其代码如下所示（result.html）：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Result</title>
</head>
<body>
    <p>您提交的数据如下:</p>
    <p>姓名： <span th:text="${user.name}" /></p>
    <p>年龄： <span th:text="${user.age}" /></p>
</body>
</html>

在result.html中，我们使用了th:text属性来获取用户模型中的数据，并将其呈现给用户。

结论

本文中，我们对Thymeleaf进行了介绍，并通过示例说明了如何将其与Spring Boot集成，以及如何使用Thymeleaf渲染模板。Thymeleaf是一个功能强大，易于使用，易于扩展的模板引擎。有了它，我们可以轻松地创建精美和清晰的Web页面。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎 - Python技术站

详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎

简介

如何使用Thymeleaf

示例一：渲染一个简单的列表

示例二：渲染一个表单

结论

相关文章