[thymeleaf] 教程

2019-12-18 本文已影响0人 AustinPup

1 定义

thymeleaf 是一个模板引擎，能够处理html、xml、js。

2 处理类型

html、xml、text、js、css、raw

2.1 Dialects(这里理解为自定义的表达式)

Thymeleaf是一个非常可扩展的模板引擎（实际上它可以被称为模板引擎框架），它允许您定义和定制模板的处理方式，使其达到一个很好的细节级别。
就是thymeleaf自定义的一些属性；

常用表达式
${...} 变量表达式
*{...} 选择表达式
#{...} 消息文字表达式
@{...} 链接url表达式
#maps 工具对象表达式
常用标签
th:action 定义后台控制器路径
th:each 循环语句
th:field 表单字段绑定
th:href 定义超链接
th:id div标签的id声明
th:if 条件判断
th:include 布局标签，替换内容到引入文件
th:fragment 布局标签，定义一个代码片段，方便其他地方引用
th:object 替换对象
th:src 图片类地址引入
th:text 显示文本
th:value 属性赋值
常用函数
#dates 日期函数
#lists 列表函数
...

3 Text使用

3.1 支持多语言

代码如下：

<!DOCTYPE html>

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

  <head>
    <title>Good Thymes Virtual Grocery</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" media="all" 
          href="../../css/gtvg.css" th:href="@{/css/gtvg.css}" />
  </head>

  <body>
  
    <p th:text="#{home.welcome}">Welcome to our grocery store!</p>
  
  </body>

</html>

浏览器会忽略它不了解的属性，例如 th:text, 这里既可以写 th:text,也可以写data-th-text, data-是HTML5规范允许使用的自定义属性。

th:text 外部化文本

Thymeleaf 使用#{...} 语法来制定文本，该用法相当于一个常量或者i18n文本吧。

<p th:text="#{home.welcome}">Welcome to our grocery store!</p>

外部化文本的存放位置缺省实现是Resolverorg.thymeleaf.messageresolver.StandardMessageResolver。标准消息解析器的位置在
/WEB-INF/templates/home.html中，如果想i18n的话，写法如下:

/WEB-INF/templates/home_en.properties 用于英文文本
/WEB-INF/templates/home.properties 用于默认文本（如果语言环境不匹配）

此外，外部化文本也可以自定义，取决于org.thymeleaf.messageresolver.IMessageResolver所使用的特定实现。

语境 Contexts

Thymeleaf 的语境信息的存放地，Thymeleaf核心库提供了以下每个接口的实现：

org.thymeleaf.context.Context 实施 IContext
org.thymeleaf.context.WebContext 实施 IWebContext