Thymeleaf 语法详解

雍和与木

于 2024-05-29 17:20:28 发布

阅读量519

点赞数 5

分类专栏： Thymeleaf 若依-ruoyi 文章标签：前端 javascript

本文链接：https://blog.csdn.net/mty31/article/details/139300813

版权

若依-ruoyi 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

Thymeleaf

1 篇文章 0 订阅

订阅专栏

1、常用标签

标签	作用	示例
th:id	替换 id	<input th:id="${user.id}"/>
th:text	文本替换	<p text:="${user.name}">bigsai</p>
th:utext	支持 html 的文本替换	<p utext:="${htmlcontent}">content</p>
th:object	替换对象	<div th:object="${user}"></div>
th:value	替换值	<input th:value="${user.name}" >
th:each	迭代	<tr th:each="student:${user}" >
th:href	替换超链接	<a th:href="@{index.html}">超链接</a>
th:src	替换资源	<script type="text/javascript" th:src="@{index.js}"></script>

2、链接表达式: @

我们需要在 Thymeleaf 的头部加 Thymeleaf 标识：

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

在 Thymeleaf 中，如果想引入链接比如 link，href，src，需要使用 @{资源地址} 引入资源。其中资源地址可以 static 目录下的静态资源，也可以是互联网中的绝对资源。

//引入 css
<link rel="stylesheet" th:href="@{index.css}">

//引入 JavaScript：
<script type="text/javascript" th:src="@{index.js}"></script>

//超链接：
<a th:href="@{index.html}">超链接</a>

3、变量表达式: $

3.1、在 Thymeleaf 中可以通过 ${…} 进行取值

如果在 controller 中的 Model 直接存储某字符串，我们可以直接 ${对象名} 进行取值。完整代码如下：

<h2>普通字符串</h2>
<table border="0">
    <tr>
        <td th:text="'我的名字是：'+${name}"></td>
    </tr>
</table>

3.2、取 List 集合 (each):

因为 List 集合是个有序列表，里面内容可能不止一个，你需要遍历 List 对其中对象取值，而遍历需要用到标签： th:each , 具体使用为 <tr th:each="item:${userlist}"> , 其中 item 就相当于遍历每一次的对象名，在下面的作用域可以直接使用，而 userlist 就是你在 Model 中储存的 List 的名称。完整的代码为：

<h2>List取值</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${userlist}">
        <td th:text="${item}"></td>
    </tr>
</table>

3.3、直接取 Map: 很多时候我们不存 JavaBean 而是将一些值放入 Map 中，再将 Map 存在 Model 中，我们就需要对 Map 取值，对于 Map 取值你可以 Map名[′key′]来进行取值。也可以通过{Map名.key} 取值

<h2>Map取值</h2>
<table bgcolor="#8fbc8f" border="1">
    <tr>
        <td>place:</td>
        <td th:text="${map.get('place')}"></td>
    </tr>
    <tr>
        <td>feeling:</td>
        <td th:text="${map['feeling']}"></td>
    </tr>
</table>

3.4、遍历 Map： 如果说你想遍历 Map 获取它的 key 和 value 那也是可以的，这里就要使用和 List 相似的遍历方法，使用 th:each="item:${Map名}" 进行遍历，在下面只需使用 item.key 和 item.value 即可获得值。完整代码如下：

<h2>Map遍历</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${map}">
        <td th:text="${item.key}"></td>
        <td th:text="${item.value}"></td>
    </tr>
</table>

4、选择变量表达式: *

变量表达式不仅可以写成 ${…}，而且还可以写成 *{…}。

但是，有一个重要的区别：星号语法对选定对象而不是整个上下文评估表达式。也就是说，只要没有选定的对象，美元 ( ${…} ) 和星号 ( *{...} ) 的语法就完全一样。

什么是选定对象？使用 th:object 属性的表达式的结果。就可以选定对象，具体实例如下：

<div th:object="${user}">
    <p>Name: <span th:text="*{name}">赛</span>.</p>
    <p>Age: <span th:text="*{age}">18</span>.</p>
    <p>Detail: <span th:text="*{detail}">好好学习</span>.</p>
</div>

当然 *{…} 也可和 ${…} 混用。上面的代码如果不使用选定对象，完全等价于：

<div >
    <p>Name: <span th:text="*{user.name}">赛</span>.</p>
    <p>Age: <span th:text="${user.age}">18</span>.</p>
    <p>Detail: <span th:text="${user.detail}">好好学习</span>.</p>
</div>

5、消息表达: #

文本外部化是从模板文件中提取模板代码的片段，以便可以将它们保存在单独的文件 (通常是.properties 文件) 中，文本的外部化片段通常称为 “消息”。通俗易懂的来说 #{…} 语法就是用来读取配置文件中数据的。在 Thymeleaf 你可以使用 #{...} 语法获取消息，具体实例代码如下：首先在 templates 目录下建立 home.properties 中写入以下内容：

bigsai.nane=bigsai
bigsai.age=22
province=Jiang Su

在 application.properties 中加入以下内容：

spring.messages.basename=templates/home

这样我们就可以在 Thymeleaf 中读取配置的文件了，完整代码如下：

<h2>消息表达</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr>
    <td>name</td>
    <td th:text="#{bigsai.name}"></td>
    </tr>
    <tr>
    <td>年龄</td>
    <td th:text="#{bigsai.age}"></td>
    </tr>
    <tr>
    <td>province</td>
    <td th:text="#{province}"></td>
    </tr>
</table>

雍和与木

关注

5
点赞
踩
14

收藏

觉得还不错? 一键收藏
0
评论
Thymeleaf 语法详解

3.3、直接取 Map: 很多时候我们不存 JavaBean 而是将一些值放入 Map 中，再将 Map 存在 Model 中，我们就需要对 Map 取值，对于 Map 取值你可以 Map名[′key′]来进行取值。, 其中 item 就相当于遍历每一次的对象名，在下面的作用域可以直接使用，而 userlist 就是你在 Model 中储存的 List 的名称。如果说你想遍历 Map 获取它的 key 和 value 那也是可以的，这里就要使用和 List 相似的遍历方法，使用。属性的表达式的结果。
复制链接

扫一扫

专栏目录