当前位置:网站首页>Thymeleaf简介
Thymeleaf简介
2022-07-30 05:15:00 【m0_67392931】
关于我第一次使用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:switchth: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页面是所得到的效果,模板内的内容会被替换到我们指定的位置中
td:fragment 就是定义一个片段,然后使用 td:replace 将片段中的内容替换到指定位置
这只是一个简单的测试而已,我们也可以拓展应用,比如用来替换我们做网站时的导航栏,底部,这样不就是有一个简单的模板应用了,其他强大的功能,还是需要静心学习。
本篇内容就到这里吧,我们下次再见!
边栏推荐
- Seata异常:endpoint format should like ip:port
- 参与开源,让程序员找回热血和激情
- curl (7) Failed connect to localhost8080; Connection refused
- 盘点 | 常用 PG 数据恢复方案概览【建议收藏】
- 力扣20-有效的括号——栈实现
- WeChat payment and payment callback
- MySql string splitting realizes the split function (field splitting, column switching, row switching)
- MySQL - Function and Constraint Commands
- el-table中加入el-input框和el-input-number框,实现el-table的可编辑功能
- 行业案例|数字化经营底座助力寿险行业转型
猜你喜欢

五一去见了一些身价数千万的成功人士,我一些新的思路和启示

The use of Conluce, an online document management system

Concurrent Programming Review

Golang——从入门到放弃

oracle触发器的自治事务

MySQL安装配置教程(超级详细)

JVM 内存结构 超详细学习笔记(一)

mysql basics (4)

Programmers care guide, give yourself a chance to make the occasional relaxation of body and mind

从驱动表和被驱动表来快速理解MySQL中的内连接和外连接
随机推荐
Hexagon_V65_Programmers_Reference_Manual (14)
开源之夏 2022 重磅来袭!欢迎报名 RadonDB 社区项目!
Hexagon_V65_Programmers_Reference_Manual(14)
go language study notes 4
容器化 | 构建 RadonDB MySQL 集群监控平台
【小程序项目开发 -- 京东商城】uni-app 商品分类页面(下)
I went to meet some successful people worth tens of millions on May 1st, and I have some new ideas and inspirations
Hexagon_V65_Programmers_Reference_Manual(12)
The Golden Circle Rule: Deep Thinking Methods for Successful People
给小白的 PostgreSQL 容器化部署教程(上)
JVM 垃圾回收 超详细学习笔记(二)
golang八股文整理(持续搬运)
一文带你吃透js处理树状结构数据的增删改查
开源之夏 2022 与您相约!
无代码开发平台重新申请入门教程
Docker-compose install mysql
[High Performance Computing] openMP
力扣541-反转字符串2——双指针法
工具 | 常用 PostgreSQL 预防数据丢失方案
IGBT wafers used in photovoltaic inverters