Thymeleaf简介

温眸ゅ

已于 2022-04-26 12:46:52 修改

阅读量3w

点赞数 19

分类专栏： SpringBoot 文章标签： spring

于 2022-04-25 22:19:13 首次发布

本文链接：https://blog.csdn.net/wenmou_/article/details/124414888

版权

SpringBoot 专栏收录该内容

3 篇文章 1 订阅

订阅专栏

关于我第一次使用Thymeleaf写模板代码，被折磨这件事…

Thymeleaf官网

https://www.thymeleaf.org/

学习中自然少不了查阅文档，虽然这对于一个英语学渣来说是一件比较痛苦的事情，但是还是要说，既然要学习编程，大部分文档都是英文的，还是要努力克服一下，说不定时间长了就看懂了呢，还能顺带小小的提升一下自己的词汇量。

Thymeleaf模板引擎

Thymeleaf作为众多模板引擎中的一种，我最初也是对它充满了陌生，在我学习SpringBoot并且试图通过学习来搭建属于自己的个人博客网站时，前端代码是少不了的，选择Thymeleaf来写模板自然不是因为我学的有多么好，而是因为我选择的教程是用的Thymeleaf，而我又不会其他的…

当然，学习Thymeleaf之前还是需要掌握一点web的知识的，我认为有着web基础多多少少能为我们的Thymeleaf之路提供了一点便利，减少一丢丢的痛苦。

Thymeleaf模板文件后缀名就是.html，制作完成后，我们可以直接打开浏览效果

使用之前我们需要现在我们的SpringBoot项目中添加Thymeleaf的依赖，即在pom.xml文件中添加如下代码：

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

我们的html文件也需要放置在template的文件夹下，这样我们就可以开始使用Thymeleaf模板引擎了
还有一个存放静态资源的文件夹static

Thymeleaf简单示例

在这里插入图片描述
可以看到，当我们没有传递参数直接静态访问时，页面就会是下图中的效果

当时当我们传递参数后，页面中的内容就会被替换为我们传递的内容

常用标签

标签	作用	示例
`th:text`	替换文本	`th:text="${title}"`
`th:value`	替换值	`th:value="${user.name}"`
`th:each`	迭代	`th:each="stu:${user}"`
`th:href`	替换链接	`th:href="@{/index.html}"`
`th:src`	替换资源	`th:src="@{/img/Wechat.jpg}"`
`th:if`	条件判断	`th:if="${isVip}"`
`th:switch` `th:case`	条件判断	`th:switch="${sex}"` `th:case="'man'"`
`th:insert`	插入	`th:insert="footer :: copy"`
`th:replace`	替换	`th:replace="footer :: copy"`
`th:fragment`	定义片段	`th:fragment="frag (onevar,twovar)"`

在Thymeleaf 中，如果想引入链接比如link，href，src，需要使用@{资源地址}引入资源

接下来便是我编写Thymeleaf页面的崎岖之旅

第一步：将html页面中的html标签修改成<html xmlns:th="http://www.w3.org/1999/xhtml">

第二步：编写Thymeleaf页面，我就浅浅的编写一下吧，首先就是定义一个.html的文件作为我们的Thymeleaf文件，我就命名为_thymeleaf
在这里插入图片描述
然后在我们的页面中写上如下代码

下面就是我们在请求test页面是所得到的效果，模板内的内容会被替换到我们指定的位置中