一、thymeleaf官网

官网:https://www.thymeleaf.org/index.html

doc:https://www.thymeleaf.org/documentation.html

二、springmvc+thymeleaf从这里开始

1.修改pom.xml,引入相关依赖。

  1. <dependencies>
  2. <dependency>
  3. <groupId>junit</groupId>
  4. <artifactId>junit</artifactId>
  5. <version>3.8.1</version>
  6. <scope>test</scope>
  7. </dependency>
  8. <!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf -->
  9. <dependency>
  10. <groupId>org.thymeleaf</groupId>
  11. <artifactId>thymeleaf</artifactId>
  12. <version>3.0.2.RELEASE</version>
  13. </dependency>
  14. <!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf-spring4 -->
  15. <dependency>
  16. <groupId>org.thymeleaf</groupId>
  17. <artifactId>thymeleaf-spring4</artifactId>
  18. <version>2.1.2.RELEASE</version>
  19. </dependency>
  20. </dependendies> 

2.xml方式配置thymeleaf视图解析器:

  1. <!-- Thymeleaf View Resolver - implementation of Spring's ViewResolver interface -->
  2. <bean id="viewResolver" class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
  3. <property name="templateEngine" ref="templateEngine" />
  4. <property name="characterEncoding" value="UTF-8" />
  5. </bean>
  6.  
  7. <!-- Thymeleaf Template Engine (Spring4-specific version) -->
  8. <bean id="templateEngine" class="org.thymeleaf.spring4.SpringTemplateEngine">
  9. <property name="templateResolvers">
  10. <set>
  11. <ref bean="templateResolver" />
  12. </set>
  13. </property>
  14. </bean>
  15.  
  16. <!-- Thymeleaf Template Resolver -->
  17. <bean id="templateResolver" class="org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver">
  18. <property name="prefix" value="/WEB-INF/templates/" />
  19. <property name="templateMode" value="HTML" />
  20. <property name="suffix" value=".html"></property>
  21. <property name="characterEncoding" value="UTF-8"></property>
  22. </bean>

3.在controller中为变量name赋值。

  1. @RequestMapping(value="/index")
  2. public String index(Model model){
  3. model.addAttribute("name","world");
  4. return "index.html";
  5. }

4.在index.html中使用thymeleaf语法读取变量name的值。

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <title>Title</title>
  5. </head>
  6. <body>
  7. <div>your name is:<span th:text="${name}"></span></div>
  8. </body>
  9. </html>

注意:需要修改html节点,添加xmlns:th="http://www.thymeleaf.org"

三、thymeleaf常见问题小结

1.如何添加链接:

  1. <a th:href="@{/category/index}">首页</a>
  1. <a class="btn btn-xs btn-default" th:href="@{/role/edit(roleId=${r.roleId})}">编辑</a>

2.表单绑定示例:

  1. <form method="post" th:object="${cate}" th:action="@{/category/save}" enctype="multipart/form-data">
  2. <table>
  3. <tr>
  4. <td>id:</td>
  5. <td><input type="text" th:field="*{cateId}"></td>
  6. </tr>
  7. <tr>
  8. <td>name:</td>
  9. <td><input type="text" th:field="*{cateName}"></td>
  10. </tr>
  11. <tr>
  12. <td>file:</td>
  13. <td>
  14. <input type="file" accept="image/jpeg,image/png,image/jpg" name="picture">
  15. </td>
  16. </tr>
  17. <tr>
  18. <td colspan="2">
  19. <input type="submit" value="提交">
  20. </td>
  21. </tr>
  22. </table>
  23. </form>

3.展示文本

  1. <td th:text="${r.name}"></td>

如何替换子字符串

  1. <span th:text="|welcome,${name}|"></span>

如何转换日期格式

  1. ${#dates.format(v.AddDate,'yyyy-MM-dd HH:mm:ss')}

4.如何在js读取后台数据

  1. var url="[[${url}]]";

5.条件表达式

  1. <td th:text="(${r.deleteFlag}==0)?'正常':'删除'"></td>

6.thymeleaf如何实现switch选择

  1. <td th:switch="${r.type}">
  2. <span th:case="page">页面</span>
  3. <span th:case="module">模块</span>
  4. <span th:case="*">其他</span>
  5. </td>

注意:默认值 用th:case="*"

7.th:object语法

首先在controller为对象赋值

  1. @Controller
  2. @RequestMapping("/demo")
  3. public class DemoController {
  4. @RequestMapping("/index")
  5. public String index(Model model){
  6. OrgResource resource=new OrgResource();
  7. resource.setId("11");
  8. resource.setName("test");
  9. model.addAttribute("resource",resource);
  10. return "demo/index.html";
  11. }
  12. }

使用*{}语法可以方便读取th:object对象的属性。

  1. <div th:object="${resource}">
  2. <div th:text="*{id}"></div>
  3. <div th:text="*{name}"></div>
  4. </div>

8.迭代 th:each

  1. <th:block th:each="r,iterstat:${resources}">
  2. <tr th:class="${iterstat.odd}?'odd'">
  3. <td th:text="${r.orderNo}"></td>
  4. <td th:switch="${r.type}">
  5. <span th:case="page">页面</span>
  6. <span th:case="module">模块</span>
  7. </td>
  8. <td th:text="(${r.deleteFlag}==0)?'正常':'删除'"></td>
  9. <td th:switch="${r.deleteFlag}">
  10. <span th:case="0"><a>删除</a></span>
  11. <span th:case="1"><a>恢复</a></span>
  12. </td>
  13. </tr>
  14. </th:block>

9.如何使用Fragment layout布局

首先新建layout.html作为布局模板。

  1. <!DOCTYPE html>
  2. <html lang="zh-CN" xmlns:layout="http://www.thymeleaf.org" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. ……
  8. <body>
  9. <div layout:fragment="content"></div>
  10. </body>
  11. </html>

然后在index.html中使用layout,并用页面具体内容替代content fragment。

  1. <!DOCTYPE html>
  2. <html layout:decorator="task/layout" xmlns:layout="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <div layout:fragment="content">
  9. 测试页面
  10. </div>
  11. </body>
  12. </html>

第一次使用layout布局的时候,调试了好半天就是不生效。后来找到了原因,dependency需要添加:

  1. <dependency>
  2. <groupId>nz.net.ultraq.thymeleaf</groupId>
  3. <artifactId>thymeleaf-layout-dialect</artifactId>
  4. <version>${nz.net.ultraq.thymeleaflayout-version}</version>
  5. </dependency>

10.如何用if条件动态调整form action

  1. <form th:action="@{/Video/{path}(path=${isCollect}?'CollectVideoList':'VideoList')}">

11.thymeleaf回显富文本编辑器内容
将th:text换成th:utext即可。
  1. <script type="text/plain" id="content" name="content" th:utext="${article.content}"></script>

JAVA入门[22]—thymeleaf的更多相关文章

  1. JAVA入门--目录

    在此记录自己的JAVA入门笔记,备忘 JAVA入门[1]--安装JDK JAVA入门[2]-安装Maven JAVA入门[3]—Spring依赖注入 JAVA入门[4]-IntelliJ IDEA配置 ...

  2. 新一代Java模板引擎Thymeleaf

    新一代Java模板引擎Thymeleaf-spring,thymeleaf,springboot,java 相关文章-天码营 https://www.tianmaying.com/tutorial/u ...

  3. Java入门基础(变量、操作符与表达式)

    Java入门基础 1. 第一个程序 2.变量(命名.运算.整数/小数/字符串.布尔类型) 3.操作符与表达式(算术/逻辑/关系/赋值/自增/类型转换操作符) HelloWorld! public cl ...

  4. Java入门(3)

    阅读书目:Java入门经典(第7版) 作者:罗格斯·卡登海德 在程序中使用字符值时,必须用单引号将赋给变量的字符值括起来,对于字符串必须用双引号括起来. int整型-2.14*10^9~2.14*10 ...

  5. Java安全之Thymeleaf SSTI分析

    Java安全之Thymeleaf SSTI分析 写在前面 文章首发:https://www.anquanke.com/post/id/254519 最近看了一遍Thymeleaf,借此机会学习一下Th ...

  6. Java入门第一章

    后天就是十一长假了,亲们准备好了去哪儿玩了吗? 今天有点空,就来聊聊Java吧,当然是一些Java入门知识了,网上有很多,这里我只是列举一些我自己学到的,感谢大家关注喵的博客这么久,也为大家带来点新知 ...

  7. [Java入门笔记] 面向对象编程基础(二):方法详解

    什么是方法? 简介 在上一篇的blog中,我们知道了方法是类中的一个组成部分,是类或对象的行为特征的抽象. 无论是从语法和功能上来看,方法都有点类似与函数.但是,方法与传统的函数还是有着不同之处: 在 ...

  8. 第1章Java入门体验

    第1章Java入门体验 1.java简介和平台应用 Java是sun公司开发出来,现在属于ORACLE公司java分为几个部分:首先是最基础的Java SE部分,这部分是Java的基础知识,主要包括: ...

  9. Java入门记(五):容器关系的梳理(下)——Map

    注意:阅读本文及相关源码时,需要数据结构相关知识,包括:哈希表.链表.红黑树. Map是将键(key)映射到值(value)的对象.不同的映射不能包含相同的键:每个键最多只能映射到一个值.下图是常见M ...

随机推荐

  1. cpp(第九章)

    1.静态外部,不在任何函数内定义.静态内部,不在任何函数内,使用关键字static.静态无连接性,在代码块中,使用关键字static. 2.静态变量会自动零初始化. 3.单定义规则,在每个使用外部变量 ...

  2. 在Visual Studio for Mac中使用fastlane管理iOS的provision

    Xamarin开发中,最烦的就是provision的管理了. 全手工的话,要先创建一个key,上传后生成cert文件,再创建provision.如果在手机上调试,还要把手机加到provision中去. ...

  3. ReactJS入门基础

    渲染这俩字可能在很多地方都见过.但可能不太理解是啥意思. 那么首先我们来理解一下渲染. 渲染 我觉得这样理解比较通俗. 我们做一个汽车,开始是没有喷漆的(没有css) 只是些框框架架(HTML标签). ...

  4. Thrift中required和optional

    最近在搞Thrift,对其字段声明中的required关键字有所误解,仔细调试了一下才明白其真实含义. required的意思不是说声明对象时,必须填这个值,而是Thrift在传输(序列化)过程中无论 ...

  5. python爬虫 模拟登陆校园网-初级

    最近跟同学学习爬虫的时候看到网上有个帖子,好像是山大校园网不稳定,用py做了个模拟登陆很有趣,于是我走上了一条不归路..... 先上一张校园网截图 首先弄清一下模拟登陆的原理: 1:服务器判定浏览器登 ...

  6. [leetcode-604-Design Compressed String Iterator]

    Design and implement a data structure for a compressed string iterator. It should support the follow ...

  7. 微信小程序开发者注册流程

    一,首先打开浏览器,搜索微信公众平台 点击进入,此时还没有注册微信小程序开发账号,我们需要点击注册 进入注册页面,会出现四种账号,我们选择小程序账号 然后根据提示就可以进行注册了 注册时,需填写一下个 ...

  8. RocksDB上锁机制

    RocksDB作为一个开源的存储引擎支持事务的ACID特性,而要支持ACID中的I(Isolation),并发控制这块是少不了的,本文主要讨论RocksDB的锁机制实现,细节会涉及到源码分析,希望通过 ...

  9. 第一个SpringMVC实例和解析(HelloSpringMVC)

    1. 开发步骤: (1)增加Spring支持 下载Spring安装包和其依赖的commons-logging.jar,复制到项目Web应用的lib文件夹(WebRoot/WEB-INF/lib): S ...

  10. 简单来说一下ui-route

    UI-Router被认为是AngularUI为开发者提供的最实用的一个模块,它是一个让开发者能够根据URL状态或者说是'机器状态'来组织和控制界面UI的渲染,而不是仅仅只改变路由(传统AngularJ ...