Thymeleaf是一款用于渲染XML/XHTML/HTML5内容的模板引擎,类似JSP,Velocity,FreeMaker等,它也可以轻易的与Spring MVC等Web框架进行集成作为Web应用的模板引擎,用于替代JSP完全没有问题
文档
头部提示
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
JSON的解析
<div th:text="${article['content']}"></div>
style
<div th:style="${newCate} eq ${item['cateName']} ? 'display:block' : ''"></div>
class
th:classappend="${page == pageNnm} ? 'active' : ''"
遍历
<tr th:each="cate:${cateList}">
<td th:text="${cate.sort}"></td>
<td th:text="${cate.name}"></td>
<td>0</td>
<td th:text="${cate.createDate}"></td>
<td th:text="${cate.updateDate}"></td>
</tr>
遍历中的index
<div th:each="item : ${hot}">
<span th:text="${itemStat.count}">1</span>
<a th:href="'/article/'+${item.id}" th:text="${item.title}"></a>
</div>
- index:当前迭代对象的index(从0开始计算)
- count: 当前迭代对象的index(从1开始计算)
- size:被迭代对象的大小
- current:当前迭代变量
- even/odd:布尔值,当前循环是否是偶数/奇数(从0开始计算)
- first:布尔值,当前循环是否是第一个
- last:布尔值,当前循环是否是最后一个
图像
<img th:src="@{${session.config.avatar}}">
时间
<div th:text="${#dates.format(article.createDate, 'yyyy-MM-dd')}"></div>
onclick
<span class="option" th:onclick="edit([[${category.cateId}]])">重命名</span>
下拉选中
<select name="recommend" id="recommend">
<option value="0" th:selected="${article.recommend == 0}">不推荐</option>
<option value="1" th:selected="${article.recommend == 1}">推荐</option>
</select>
解析HTML
<span th:utext="${item.intro}"></span>
模板
创建个html文件,如common.html
<!--底部-->
<div th:fragment="footer">
<span>© 2020</span>
</div>
使用
<!--底部-->
<div th:insert="common::footer"></div>
注意:模板需要放在templates目录下,不然无法找到

重定向和转发
redirect: 重定向,没有数据
forward: 请求转发,带数据,默认
如:return "redirect:/";
自定义错误页面
在templates下创建error文件夹,放入错误页的html

4xx
代表4开头的错误,也可以创建具体的每个状态页面,比如404、400
script绑定数据
<script th:inline="javascript">
// 语法 [[${article.content}]]
$('#content').html(marked([[${article.content}]]))
// 同样可以使用判断
$('#content').html(marked([[${article != null ? article.content : ''}]]))
</script>