Thymeleaf 的基本使用

2021/7/16 23:05:38

编程Tag： 使用 spring 语法 ... th 基本 Thymeleaf

本文主要是介绍Thymeleaf 的基本使用，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

Spring Boot Thymeleaf的整合

Thymeleaf 的基本使用

Spring Boot的起步依赖

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

thymeteaf的yml基本配置文件 springboot 返回的静态资源默认在template下寻找欢迎页面默认在 static文件内寻找 favicon.ico 可以设置标题图标默认放在static文件夹中

# 默认路径
spring.thymeleaf.prefix=classpath:/templates/ // 自定义静态根目录
# 后缀
spring.thymeleaf.suffix=.html//自定义后缀
# 模板格式
spring.thymeleaf.mode=HTML5 
spring.thymeleaf.encoding=UTF-8 //编码方式
spring.thymeleaf.content-type=text/html //项目名称 
spring.thymeleaf.cache=false //缓存

thymeteeaf 的基本语法

使用thymeleaf语法需要引入外部语法库

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

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

3> 变量表达式 ${} 在行内是可以使用[["key"]]来取值的

<table border="0">
    <tr>
        <td th:text="'我的名字是：'+${name}"></td> <--name是在服务器内部放入的数据--/>
    </tr>
     <tr>
        <td>介绍</td>
        <td th:text="${user.name}"></td><--对象的取值--/>
    </tr>
</table>

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

<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> 选择变量表达式: *{...} 可以更好的取值

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

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

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

5> 消息表达: #{...}

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

在templates下创建创建一个home.properties文件

nane=zzy	
age=20

在application.yml文件中写入

spring.messages.basename=templates/home

这样就可以在html中读取文件

<table bgcolor="#ffe4c4" border="1">
    <tr>
    <td>name</td>
    <td th:text="#{name}"></td>
    </tr>
    <tr>
    <td>年龄</td>
    <td th:text="#{age}"></td>
    </tr>
</table>

这篇关于Thymeleaf 的基本使用的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

Thymeleaf 的基本使用

Spring Boot Thymeleaf的整合

Thymeleaf 的基本使用

相关编程文章