SpringBoot集成Thymeleaf模板

最新推荐文章于 2024-07-22 08:30:00 发布

TxCode

最新推荐文章于 2024-07-22 08:30:00 发布

阅读量268

点赞数 1

分类专栏： SpringBoot 笔记文章标签： spring boot java 后端

本文链接：https://blog.csdn.net/weixin_43973404/article/details/120996155

版权

二.集成Thymeleaf模板

2.1 了解

Thymeleaf 是一个流行的模板引擎，该模板引擎采用 Java 语言开发
模板引擎是一个技术名词，是跨领域跨平台的概念，在 Java 语言体系下有模板引擎，在 C#、PHP 语言体系下也有模板引擎，甚至在 JavaScript 中也会用到模板引擎技术，Java 生态下的模板引擎有 Thymeleaf 、Freemaker、Velocity、Beetl（国产）等。
Thymeleaf 对网络环境不存在严格的要求，既能用于 Web 环境下，也能用于非 Web 环境下。在非 Web 环境下，他能直接显示模板上的静态数据；在 Web 环境下，它能像 Jsp 一样从后台接收数据并替换掉模板上的静态数据。它是基于 HTML 的，以 HTML 标签为载体，Thymeleaf 要寄托在 HTML 标签下实现。
SpringBoot 集成了 Thymeleaf 模板技术，并且 Spring Boot 官方也推荐使用 Thymeleaf 来替代 JSP 技术，Thymeleaf 是另外的一种模板技术，它本身并不属于 Spring Boot，Spring Boot只是很好地集成这种模板技术，作为前端页面的数据展示，在过去的 Java Web 开发中，我们往往会选择使用 Jsp 去完成页面的动态渲染，但是 jsp 需要翻译编译运行，效率低
Thymeleaf 的官方网站：http://www.thymeleaf.org
Thymeleaf 官方手册：https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html

2.2 SpringBoot集成Thymeleaf

1.创建Springboot项目，添加web和Thymeleaf依赖
在这里插入图片描述

按照这种方式创建后，pom.xml文件下会自动添加如下依赖

<!--SpringBoot框架集成Thymeleaf的起步依赖-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!--SpringBoot框架web项目起步依赖-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>

2.application.properties中对Thymeleaf进行配置
thymeleaf是一个模板引擎，缓存的意思是加载一次模板之后便不会在加载了，对于生产环境应该加上缓存，但是在开发过程中如果打开缓存，不方便开发人员调试。试想一下，改一行html，就需要重启服务器，肯定是不方便的
在这里补充一下：本地开发环境下，需要把缓存关闭，否则调试成本太大。其他环境下缓存都需要打开。

#设置thymeleaf模版引擎的缓存,设置为false关闭,默认为true开启
spring.thymeleaf.cache=false

#设置thymeleaf模版引擎的前/后缀,(可选项)，视图解析，默认就是resources/templates
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html

3.创建ThymeleafController去映射到模板页面（和SpringMVC基本一致）

@Controller
public class IndexController {
   
    @RequestMapping(value = "/index")
    public String index(Model model) {
   
        model.addAttribute("data","SpringBoot Thymeleaf");
        return "index"; //之前的视图解这里路径会变为/templates/index.html
    }
    @RequestMapping(value = "/index1")
    public ModelAndView index1() {
   
        ModelAndView mv = new ModelAndView();
        mv.setViewName("index");
        mv.addObject("data","SpringBoot");
        return mv;
    }
}

4.在src/main/resources的templates下创建一个index.html页面
HTML页面恶< html >元素中加入以下属性：

<html xmlns:th="http://www.thymeleaf.org">

<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>SpringBoot集成Thymeleaf</title>
</head>
<body>
<div th:text="${data}">xxx</div>
<h1>Thymeleaf</h1>
<h1>Thymeleaf</h1>
<h1>Thymeleaf</h1>
</body>
</html>

5.启动程序，浏览访问http://localhost:8080/index
在这里插入图片描述
注意：Springboot使用thymeleaf作为视图展示，约定将模板文件放置在src/main/resource/templates目录下，静态资源放置在src/main/resource/static目录下

2.3 Thymeleaf的表达式

2.3.1初始化步骤

1.创建SpringBoot的web项目并使用模板引擎
如上例
2.在application.properties中设置thymeleaf参数

#设置thymeleaf模版引擎的缓存,设置为false关闭,默认为true开启
spring.thymeleaf.cache=false

#设置thymeleaf模版引擎的前/后缀,(可选项),当前配置的路径其实默认就是。
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html

3.创建实体User实体类

public class User {
   
    private Integer id;
    private String username;
    private Integer age;
}

4.创建ThymeleafController类

5.在src/main/resources/templates在创建html页面

2.3.2 表达式

1.标准变量表达式
标准变量表达式用于访问容器（tomcat）上下文环境中的变量，功能和EL中的 $ {} 相
同。Thymeleaf 中的变量表达式使用${变量名} 的方式获取Controller中model其中的数据

<body>
<h1>标准变量表达式:${} -> (推荐)</h1>
用户编号:<span th:text="${user.id}"></span><br/>
用户姓名:<span th:text="${user.username}"></span><br/>
用户年龄:<span th:text="${user.age}"></span><br/>

2.选择变量表达式

<h1>选择变量表达式(星号表达式):*{} -> (不推荐)</h1>
<!--
    *{}必须使用th:object属性来绑定这个对象
    在div子标签中使用*来代替绑定的对象${user}
-->
<div th:object="${user}">
    用户编号:<span th:text="*{id}"></span><br/>
    用户姓名:<span th:text="*{username}"></span><br/>
    用户年龄:<span th:text="*{age}"></span><br/>
</div>

<h1>标准变量表达式与选择变量表达式的混合使用(不推荐)</h1>
用户编号<span th:text="*{user.id}"></span><br/>
用户年龄<span th:text="*{user.age}"></span><br/>
用户姓名<span th:text="*{user.username}">