SpringBoot 整合 Thymeleaf-阿里云开发者社区

SpringBoot 整合 Thymeleaf

2022-04-29 137

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： jsp输出页面是通过 response.getWriter().write 去一点一点写会给浏览器，效率低，我们也发现了这个问题，于是，在 SpringBoot 中提倡使用一种新的视图解析，他就是 Thymeleaf，他是把整个 HTML 页面直接返回，效率高，使用方式就是先在 pom.xml 中引入 spring-boot-starter-thymeleaf 坐标，然后配置下视图解析器，和 jsp 的视图解析器类似，之后就可以使用了，非常简单

pom.xml

<parent>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-parent</artifactId>
    <version>2.6.6</version>
    <relativePath/>
</parent>
<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    <dependency>
        <groupId>org.projectlombok</groupId>
        <artifactId>lombok</artifactId>
        <optional>true</optional>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
</dependencies>

application.yml

server:
  port: 8080
spring:
  thymeleaf:
    prefix: classpath:/templates/
    suffix: .html
    mode: HTML5
    encoding: UTF-8

IndexController

@Controller
@RequestMapping("/index")
public class IndexController {
    @GetMapping("/index")
    public String index(){
        System.out.println("首页");
        return "index";
    }
}

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>Hello Thymeleaf</h1>
</body>
</html>

结果

数据传递

去index时，添加了一个User集合，怎么获取呢

@Controller
@RequestMapping("/index")
public class IndexController {
    @GetMapping("/index")
    public String index(Model model){
        System.out.println("首页");
        List<User> users = new ArrayList<>();
        users.add(new User(1,"小刘",12));
        users.add(new User(2,"张三",23));
        users.add(new User(3,"王五",10));
        model.addAttribute("users",users);
        return "index";
    }
}

index.html

<!DOCTYPE html>
<html xmlns:th = "http://www.thymeleaf.org"></html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>Hello Thymeleaf</h1>
<table>
    <tr>
        <th>id</th>
        <th>name</th>
        <th>age</th>
    </tr>
    <tr th:each="user:${users}">
        <td th:text="${user.id}"></td>
        <td th:text="${user.name}"></td>
        <td th:text="${user.age}"></td>
    </tr>
</table>
</body>
</html>