乐趣区

关于springboot:Thymeleaf常用标签说明

jiezi

之前在咱们开发我的项目, 做 view 试图模块时, 咱们通常是应用 JSP, 然而随着技术的倒退, 以及 springboot 的应用日渐增多, 在 springboot 的我的项目中曾经慢慢不再应用 JSP 去作为 view, 而是逐步采纳了 Thymeleaf 这项技术.

Thymeleaf

简略地说,Thymeleaf 是一个 html 模板引擎，提供了与 Spring MVC 进行整合的 API，可作为 MVC 架构中 Web 利用的 View 层.

而在 springboot 中导入 Thymeleaf 的办法也在上文 –thymeleaf 导入中有所介绍, 也不做过多赘述.

然而有一点须要留神: 可能在开发过程中, 大家会感觉每次更改页面后, 都要从新重启服务, 很是麻烦与反人类, 能够通过配置热启动来改善.

spring.thymeleaf.cache=false

cache 是 thymeleaf 带有的一个缓存区, 咱们将它设置为 false 即可不须要每次重启服务, 间接刷新界面就能够(但要留神服务端的代码批改的话还是须要重启服务器)

但也不要一味的认为 cache 的设置就是麻烦的, 它次要的作用是要在我的项目上线时设置为 true(不设置默认为 true), 这样它会提供一个缓存区, 不必每次都向服务器申请数据, 能够无效的进步响应速度.

Thymeleaf 标签

关与 Thymeleaf 标签的具体应用在官网中的文档中都能够找到, 本文只是说一些罕用到的标签, 详解还请参照官网文档.

数据迭代

在 thymeleaf 中数据的循环迭代应用的是 th:each=”x1:${x2}”,
作用能够取出域中的数据 (数组 / 汇合) 去进行循环, 通常配合 th:text=”${x1.x3}” 应用.

其中 x2 为域中存储的数据名称;x1 为本人定义的名称, 用于在页面中应用数据;x3 为 x2 中的属性, 要和 get 办法名统一.

代码如下:

<tr th:each="g:${list}">
    <td th:text="${g.id}"></td>
    <td th:text="${g.name}"></td>
</tr>

超链接

在 thymeleaf 中超链接应用th:href=”@{x1(x2=${x3.x4})}”,

x1 为超链接指向的门路;x2 为本人命名的名称;x3,x4 为上边数据迭代中的th:text=”${x1.x3}”x1 和 x3.

代码如下:

<a th:href="@{/goods/doDeleteById(id=${g.id})}">
delete
</a>

对于超链接指向地址, 还提供了 restful 格调的写法,
平时咱们所写代码地址上带申请数据个别为:a/b/c?id=x
而 restful 这种格调为:a/b/c/{id}

代码如下:

<a th:href="@{/goods/doFindById/{id}(id=${g.id})}">
update
</a>

在这种语法中,{id}为一个变量表达式, 由前面 () 内的内容补充, 如果咱们心愿在后端的 Controller 类的办法参数中取得传递的参数, 就须要加 @PathVariable 形容参数.

提交表单

在 thymeleaf 中提交表单采纳th:action=”@{x1}”

x1 为表单所要提交至的地址.

代码如下:

<form th:action="@{/goods/doUpdateGoods}" method="POST">
<input type="text" name="name" th:value="${goods.name}">

当你感觉上述代码如果显示时有很多属性, 而每个属性都须要 ${对象名. 属性名}的形式来显示会很反复, 想把对象名间接提取进去, 能够通过在表单上加th:object,

代码如下:

<form th:action="@{/goods/doUpdateGoods}" method="POST" th:object="${goods}">
<input type="text" name="name" th:value="${name}">

拓展

1)当咱们的 url 地址没有以 ”/” 结尾时, 默认这个内容要替换到当初地址栏 url 最初一个 ”/” 后的内容进行拼接.

2)申请转发:return “forward:doGoodsUI”;
重定向:return “redirect:/goods/doGoodsUI”;
申请转发因为是服务端外部转发所以能够不写 ”/”, 间接跳转;
而重定向因为是二次申请二次响应, 且能够跳转至别的资源甚至是别的服务器, 所以须要写相对地址, 必须以 ”/” 结尾!

退出移动版