初步学习Spring Boot整合Thymeleaf

Thymeleaf简介

Thymeleaf是新一代jaa模板引擎，类似于Velocity、FreeMarker等传统Java模板引擎。与传统Java模板引擎不同的是，Thymeleaf支持HTML原型，既可以让前端工程师在浏览器中直接查看样视，也可以让后端工程师结合真实数据查看效果。

Spring Boot整合Thymeleaf步骤

1、创建工程，添加依赖

新建一个SpringBoot工程，然后添加spring-boot-starter-thymeleaf依赖，代码如下：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.5.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.learn</groupId>
    <artifactId>thymeleaf</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>thymeleaf</name>
    <description>thymeleaf project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
    </properties>

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

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
            <exclusions>
                <exclusion>
                    <groupId>org.junit.vintage</groupId>
                    <artifactId>junit-vintage-engine</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

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

    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

2、配置Thymeleaf

开发者对默认的Thymeleaf配置参数可以进行自定义配置，可以直接在application.properties中进行配置，部分常见配置如下：

#对默认的Thymeleaf配置参数进行自定义配置
#是否开启缓存，开发时可设置为false，默认是true
spring.thymeleaf.cache=true
#检查模板是否存在，默认为true
spring.thymeleaf.check-template=true
#检查模板位置是否存在，默认为true
spring.thymeleaf.check-template-location=true
#模板文件编码
spring.thymeleaf.encoding=UTF-8
#模板文件位置
spring.thymeleaf.prefix=classpath:/templates/
#Content-Type配置
spring.thymeleaf.servlet.content-type=text/html
#模板文件后缀
spring.thymeleaf.suffix=.html

3、创建Book实体类

package com.learn.thymeleaf.entity;

public class Book {
    private Integer id;
    private String name;
    private String author;

    public Book(Integer id, String name, String author) {
        this.id = id;
        this.name = name;
        this.author = author;
    }

    public Book() {
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getAuthor() {
        return author;
    }

    public void setAuthor(String author) {
        this.author = author;
    }
}

4、创建Book控制器

package com.learn.thymeleaf.controller;

import com.learn.thymeleaf.entity.Book;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.servlet.ModelAndView;

import java.util.ArrayList;
import java.util.List;

@Controller
public class BookController {

    @GetMapping("/books")
    public ModelAndView books(){
        List<Book> books= new ArrayList<Book>();
        Book b1=new Book();
        b1.setId(1);
        b1.setName("三国演义");
        b1.setAuthor("罗贯中");

        Book b2=new Book();
        b2.setId(2);
        b2.setName("红楼梦");
        b2.setAuthor("曹雪芹");

        books.add(b1);
        books.add(b2);

        ModelAndView mv=new ModelAndView();
        mv.addObject("books",books);
        mv.setViewName("books");

        return mv;
    }

}

5、创建视图

在resources目录下的templates目录中创建books.html，具体代码如下：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>图书列表</title>
    </head>
    <body>
        <table border="1">
            <tr>
                <td>图书编号</td>
                <td>图书名称</td>
                <td>图书作者</td>
            </tr>
            <tr th:each="book:${books}">
                <td th:text="${book.id}"></td>
                <td th:text="${book.name}"></td>
                <td th:text="${book.author}"></td>
            </tr>
        </table>
    </body>
</html>

代码解释:

• 首先在第二行导入Thymeleaf的名称空间。
• 第14~18行通过遍历将books中的数据展示出来，Thymeleaf中通过th:each进行集合遍历，通过th:text展示数据。

6、运行

运行服务器，在浏览器地址中输入“http://localhost:8080/books”,即可看到运行结果：