SpringBoot 整合 Thymeleaf

简介: 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>


结果


14.png


数据传递


去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>


注意:如果你的资源希望通过地址栏直接进行访问,那么,你可以新建一个 static 包,这是 spring boot 专门放静态资源的,约定大于配置,否则必须通过 controller 控制器映射才可以访问静态资源


761db4c39011413daa61e64773ea9791.png


thymeleaf下


cb6206755cd34dac9b6b8ba708f34370.png


static下


6f11efc214374560bdfdf8e676f8448c.png


相关文章
|
JSON JavaScript 数据可视化
SpringBoot+Thymeleaf+ECharts实现大数据可视化(基础篇)
SpringBoot+Thymeleaf+ECharts实现大数据可视化(基础篇)
1096 0
SpringBoot+Thymeleaf+ECharts实现大数据可视化(基础篇)
|
缓存 JavaScript 前端开发
SpringBoot——Thymeleaf中的th:inline(内敛文本text、内敛脚本javascript)
SpringBoot——Thymeleaf中的th:inline(内敛文本text、内敛脚本javascript)
2308 0
SpringBoot——Thymeleaf中的th:inline(内敛文本text、内敛脚本javascript)
|
缓存 编解码 移动开发
SpringBoot 整合 Thymeleaf|学习笔记
快速学习 SpringBoot 整合 Thymeleaf
184 0
SpringBoot 整合 Thymeleaf|学习笔记
|
安全 前端开发 Java
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(三)
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(三)
188 0
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(三)
|
移动开发 安全 前端开发
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(二)
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(二)
312 0
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(二)
|
消息中间件 JSON 前端开发
SpringBoot2.x系列教程08--SpringBoot中整合Thymeleaf动态模板
前言 在前面的章节中,壹哥 带各位利用SpringBoot实现了SSM整合,发现现在SSM整合变得的非常简单,通过几个配置就能搭建出一个项目开发环境。但是在之前的案例中,我们并没有提供UI界面,那么在SpringBoot中如何整合UI界面呢?使用JSP展示页面,还是用HTML展示页面,或者还有其他方案? 在今天的内容里,壹哥 会带大家学习如何在SpringBoot中展示UI界面,这样大家以后就可以把数据信息在页面上渲染展示了。 一. Web开发方式简介 SpringBoot作为一个简化项目开发的利器,其实它为我们提供了一套完整的Web开发方案,从前端到后端,再到数据库、定时任务、消息队列等都
295 0
|
开发框架 安全 Java
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(一)
狂神说SpringBoot:SpringSecurity笔记及thymeleaf静态资源(一)
516 0
|
Dubbo Java 应用服务中间件
SpringBoot——借助Maven多模块管理实现集成SSM、Dubbo、Thymeleaf的汇总案例
SpringBoot——借助Maven多模块管理实现集成SSM、Dubbo、Thymeleaf的汇总案例
SpringBoot——借助Maven多模块管理实现集成SSM、Dubbo、Thymeleaf的汇总案例
SpringBoot——Thymeleaf中的表达式基本对象、表达式功能对象
SpringBoot——Thymeleaf中的表达式基本对象、表达式功能对象
SpringBoot——Thymeleaf中的表达式基本对象、表达式功能对象
|
缓存 Java
SpringBoot——Thymeleaf中的四种字面量(文本、数字、布尔、null)、字符串拼接、运算符
SpringBoot——Thymeleaf中的四种字面量(文本、数字、布尔、null)、字符串拼接、运算符
SpringBoot——Thymeleaf中的四种字面量(文本、数字、布尔、null)、字符串拼接、运算符