- 首先如果在SpringBoot项目中使用thymeleaf,必须在pom.xml文件中导入相应的依赖
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
- thymeleaf是针对于HTML页面的如果想让thymeleaf语法在页面中正常的使用,就必须在提前告知该HTML页面是用了该语法。
<html lang="en" xmlns:th="http://www.thymeleaf.org"> 该句代码后面的xmlns:th="http://www.thymeleaf.org"就是告知页面使用thymeleaf
- 如果想把标签中的某个属性变成动态属性,在这个属性的后面再加一个th:xxx,xxx为动态属性的名称,然后在双引号中加入@或者$然后在大括号中加入要更改的内容。
<label style="color: red" th:text="${msg}"></label>
- 如果在纯文本中加入加入动态文本,则是先加两个中,在中口号中加入${对应的内容}
<a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> <img src="images/photos/user-avatar.png" alt="" /> [[${session.loginUser.userName}]] <span class="caret"></span> </a>
- thymeleaf抽取公共代码
- 如果要抽取代码首先得有一个公共的HTML文件来存放重复的HTML代码
<head th:fragment="commonheader"> <meta charset="UTF-8"> <title>公共页面</title> <link href="css/style.css" th:href="@{/css/style.css}" rel="stylesheet"> <link href="css/style-responsive.css" th:href="@{css/style-responsive.css}" rel="stylesheet"> <script src="js/html5shiv.js" th:src="@{js/html5shiv.js}"></script> <script src="js/respond.min.js" th:src="@{js/respond.min.js}"></script> </head>
- 如果要抽取代码首先得有一个公共的HTML文件来存放重复的HTML代码
上面代码中的head标签中的代码为公共代码其中th:fragment="commonheader"就是将head标签设为公共代码,除此之外,还可以将公共代码加一个id属性。
- 然后是抽取公共代码
<div th:include="common :: commonheader"></div>
<div th:replace="common :: #leftmenu"></div>
上面两句代码都是获取公共代码,两个冒号之前代表的是公共HTML文件,两个冒号之后代表的是公共的标签,上面的是通过th:fragment获取的,下面的那个是通过id选择器获取的。
- thym遍历
<tr class="gradeX" th:each="user,stats:${users}">
<td th:text="${stats.count}"></td>
<td th:text="${user.userName}"></td>
<td th:text="${user.password}"></td>
</tr>
上面的遍历是将遍历所得的内容放入表格中
${中存放的是从controller层发送过来的数组或集合}
user是单个元素
stats是状态。