熟悉Thymeleaf模板引擎

文章内容输出来源：拉勾教育Java高薪训练营

 

Thymeleaf是什么

• 服务端的Java模板引擎技术
• 有丰富的标签语言、函数和表达式
• SpringBoot默认的页面模板

 

HTML模板

• xmlns:th="http://thymeleaf.org"
  • 引入模板引擎标签
  • 使用th开头的语法标签，如th:href,th:text

 

常用标签

• th:text：显示文本内容
  • 时间的格式化：<span style="font-size: 15px;" th:text="'发布于 '+ ${#dates.format(row.created, 'yyyy-MM-dd HH:mm')}" />
• th:insert：引入页面片段到某标签中
  • <div th:insert="~{thDemo:title}"></div>
  • 将/resources/templates/thDemo模板中的title片段模板引入到该标签中
• th:replace：引入页面片段到某标签位置，替换掉此标签
  • <div th:replace="~{thDemo:title}"></div>
  • 将/resources/templates/thDemo模板中的title片段模板引入替换掉该标签
• th:each：遍历标签
  • <div th:each="row : ${page.records}"><h1 th:text="${row.title}"></h1></div>
• th:if：条件判断
• th:unless：条件为假的判断
• th:switch/th:case：swith的条件判断
• th:value：指定标签的属性值
• th:href/th:src：引入文件、设置外链
  • <img th:src="@{/login/img/login.jpg}"/>
  • <link th:href="@{/login/css/bootstrap.min.css}" rel="stylesheet"/>

        <!--分页导航的示例-->   
        <div class="page-container">
            <a class="page-active" th:href="@{'articles'}">&lt;&lt;首页</a>

            <a th:if="${page.current == 1}" class="page-disabled" href="javascript:void(0);">上一页</a>
            <a th:unless="${page.current == 1}" class="page-active" th:href="@{'articles?page=' + ${page.current - 1}}">上一页</a>

            <a class="page-current" href="javascript:void(0);" th:text="${'第' + page.current + '页/共' + page.pages + '页'}"></a>

            <a th:if="${page.current == page.pages}" class="page-disabled" href="javascript:void(0);">下一页</a>
            <a th:unless="${page.current == page.pages}" class="page-active" th:href="@{'articles?page=' + ${page.current + 1}}">下一页</a>

            <a class="page-active" th:href="@{'articles?page=' + ${page.pages}}">尾页&gt;&gt;</a>
        </div>

常用表达式

• ${...}：变量表达式
  • <p th:text="${title}">title没有值则展示此处的默认值</p>

• *{...}：选择变量表达式
  • <div th:object="${book}"><span th:text="*{title}">book.title书的标题</span></p>
• #{...}：消息表达式，国际化内容的设置
• @{...}：链接表达式
  • <a th:href="@{https://kaiwu.lagou.com/xunlianying/index.html?courseId=${courseId}#/course}">拉勾教育</a>
• ~{...}：片段表达式
  • <div th:replace="~{thDemo:title}"></div>

 

内置对象

• ctx：上下文对象
• vars：上下文变量
• locale：上下文区域设置，常用于国际化#{locale.country}
• request：HttpServletRequest对象
• response：HttpServletResponse对象
• session：HttpSession对象
• servletContext：ServletContext对象

 

项目配置使用

• 引入依赖

• 全局配置Thymeleaf的参数

• 配置静态资源
  • 在resources目录下增加静态资源目录(public|resources|static)，SpringBoot默认从这三个子目录中查找静态资源
  • 在resources目录下增加模板目录(templates)，存储html模板
• 在Controller类中添加跳转页面方法
• 编辑HTML页面

如何使用国际化

• 在resources/i118n目录下编写各国语言的国际化配置文件
  • 默认：example.properties
  • 中文：example_zh_CN.properties
  • 英文：example_en_US.properties
• 配置文件中按``key=语言内容``来配置
  • 如login.tip=请登录，login.tip=Please login!
• 全局配置中指定国际化文件的路径
  • spring.messages.basename=i118n.example
  • PS：SpringBoot默认是识别resources/messages.properties文件
• 自定义区域信息解析器
  • 实现LocaleResolver接口，并重写resolveLocale方法。并将自定义的解析器重新注册
• 在页面中使用
  • 切换语言环境
    • 携带着l=语言的参数
      • <a class="btn btn-sm" th:href="@{/toLoginPage(l='zh_CN')}">中文</a>
      • <a class="btn btn-sm" th:href="@{/toLoginPage(l='en_US')}">English</a>
  • 标签中使用文本信息
    • <title th:text=#{login.tip}>请登录</title>