`

thymeleaf日常用法

阅读更多

写在前边:

 

之前在spring boot 开发的时候,在Spring boot中使用thymeleaf的  ~{...}  这种针对fragment的写法一直不好使。原来是使用的版本和所看的文档不一致,用的是2.0的版本,但一直看3.0的文档。

<head th:fragment="common_header(title,links)">
<title th:replace="${title}">The awesome application</title>
<!-- Common styles and scripts -->
<link rel="stylesheet" type="text/css" media="all" th:href="@{/css/awesomeapp.css}">
<link rel="shortcut icon" th:href="@{/images/favicon.ico}">
<script type="text/javascript" th:src="@{/sh/scripts/codebase.js}"></script>
<!--/* Per-page placeholder for additional links */-->
<th:block th:replace="${links}" />
</head>
 
 
<head th:replace="base :: common_header(~{::title},~{::link})">
<title>Awesome - Main</title>
<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/themes/smoothness/jquery-ui.css}">
</head>

 

Spring Boot默认选择的Thymeleaf是2.0版本的,那么如果我们就想要使用3.0版本或者说指定版本呢,那么怎么操作呢?在这里要说明下 3.0的配置在spring boot 1.4.0+才支持的 ,在1.4.0版本默认的还是选择2.0版本的。

       只需要在pom.xml加入配置即可,具体看代码:

  <properties>

    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>

    <!-- set thymeleaf version -->

    <thymeleaf.version>3.0.0.RELEASE</thymeleaf.version>

    <thymeleaf-layout-dialect.version>2.0.0</thymeleaf-layout-dialect.version>

  </properties>

那么之后就是使用了3.0的模板引擎进行渲染的。

 

 

spring boot中使用thymeleaf引入依赖:

<dependency>

      <groupId>org.springframework.boot</groupId>

      <artifactId>spring-boot-starter-thymeleaf</artifactId>

</dependency>

 

 

 

下面针对thymeleaf的常用用法介绍一下:

1、注释:

1.1  <!--/*  xxxc  */-->

咱们html页面的注释 <!-- xxxx --> 这种虽然展示效果上没有了,但是通过查看源文件还是可以看到的。但是thymeleaf的注释  <!--/* <div>you can see me only before thymeleaf processes me!</div> */-->

<!--/*  xxxc  */-->  这些代码会被引擎解析时去掉,并且查看源代码也看不到哦。这种静态打开也动态运行都是看不到的哦。

 

1.2 

<table>
<tr>
<td>aaa</td>
</tr>
<!--/*-->
<tr>
<td>aaa1</td>
</tr>
<tr>
<td>aaa2</td>
</tr>
<!--*/-->
</table>

 如果是以上的这种写法,在静态打开是就会显示,但是动态程序运行时也是不显示的哦。

 

1.3 静态解析时被注释,thymeleaf解析时会移除<!--/*/ 和 /*/-->标签对,内容保留

静态时被注释掉,查看源文件可以看到,但是浏览器打开的效果是看不到展示内容的

thymeleaf解析,即动态运行时可以正常执行

 

2 、th:block

th:block用来定义一个代码块。并执行里面的属性。这将在循环的时候特别有用。

 

 3、简单表达式

变量表达式: ${...}

Selection Variable Expressions: *{...}

消息表达式: #{...}

URL表达式: @{...}

Fragment Expressions: ~{...}

 

4、th:fragment、th:include 、th:replace

 

默认spring boot读取thymeleaf文件的路径是src/main/resource/templates,静态文件是src/main/resource/static

这个默认的值是可以再application.properties中进行修改的

spring.thymeleaf.prefix=classpath:/templates/

classpath的路径是读取.class的路径

 

    文件路径:src/main/resource/templates/commom

 

 

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
  <body>
    <div th:fragment="copyright">
      © 2016 xxx 
    </div>
  </body>
</html>
 
Footer:
	<div th:include="common/footer :: copyright"></div> 
 

 

5、Flexible layouts: beyond mere fragment insertion

   

   

<head th:fragment="header(title,links,scripts)">
<title th:replace="${title}">The awesome application</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<th:block th:replace="${links}" />
<th:block th:replace="${scripts}" />

</head>

 

    调用:

<head th:include="common/header :: header(~{::title},~{::link},~{::script})"> 
<title>Awesome - Main</title>
<link rel="stylesheet" th:href="@{/css/index.css}">
<script th:src="@{/js/index.js}"></script>
</head>

    css的目录为 :src\main\resources\static\css\index.css

    @{}这种不需要执行contextPath了,默认就加入了 

  

    注意是link 和script,不是links 和scripts

    如果调用的页面没有link或者script ,则指定传入的参数为~{}即可。

<head th:include="common/header :: header(~{::title},~{},~{})"> 

 

 

相关技术来源:http://www.iteye.com/topic/1144720

分享到:
评论
1 楼 niuqiang2008 2017-08-31  
       

相关推荐

    Thymeleaf常见用法,Thymeleaf手册

    Thymeleaf常见用法,Thymeleaf使用手册,基于官方手册翻译

    Thymeleaf 基本用法总结文档

    Thymeleaf 基本用法总结文档,里面有详细的使用说明。需要的可以进行下载

    thymeleaf使用+API

    Thymeleaf是一个面向web和独立环境的现代服务器端Java模板引擎。 Thymeleaf的主要目标是将优雅的自然模板引入到您的开发工作流程中——可以在浏览器中正确显示的HTML,也可以作为静态原型工作,从而在开发团队中实现...

    Springboot Thymeleaf模板文件调用Java类静态方法

    在模板文件的表达式中,可以使用“${T(全限定类名).方法名(参数)}”这种格式来调用Java类的静态方法。 开发环境:IntelliJ IDEA 2019.2.2 Spring Boot版本:2.1.8 新建一个名称为demo的Spring Boot项目。 1、pom....

    thymeleaf-3.0.12.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-3.0.12.RELEASE.jar;...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    thymeleaf-3.0.3.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-3.0.3.RELEASE.jar;...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    spring mvc整合thymeleaf示例

    thymeleaf,我个人认为是个比较好的模板,性能也比一般的,比如freemaker的要高,而且把将美工和程序员能够结合起来,美工能够在浏览器中查看静态效果,程序员可以在应用服务器查看带数据的效果。 thymeleaf是一个...

    Thymeleaf中文参考手册_3.0.5版_thymeleaf_thymeleaf中文网_thymeleaf文档_thmele

    Thymeleaf中文文档,内容很详细,可用于做API参考。

    thymeleaf-3.0.9.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-3.0.9.RELEASE.jar;...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    thymeleaf-3.0.14.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-3.0.14.RELEASE.jar;...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    thymeleaf-spring5-3.0.10.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-spring5-3.0.10.RELEASE....使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    springboot整合thymeleaf模板

    springboot整合thymeleaf模板

    thymeleaf用法举例

    如果想要学习thymeleaf的小白同学,请下载下来看看吧,希望对你有所帮助

    eclipse模板插件thymeleaf

    eclipse插件thymeleaf。 thymeleaf-extras-eclipse-plugin-3.0.1

    thymeleaf-3.0.11.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-3.0.11.RELEASE.jar;...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

    thymeleaf-extras-java8time-3.0.1.RELEASE-API文档-中文版.zip

    赠送jar包:thymeleaf-extras-java8time-3.0.1.RELEASE.jar; 赠送原API文档:thymeleaf-extras-...使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结

    thymeleaf语法入门

    本文档以Thymeleaf官方文档为基础,科学系统地、循序渐进地将Thymeleaf的使用方法、技术细节、扩展思路铺展开来,带您走进Thymeleaf的欢乐世界。

    ThymeLeaf模板引擎教材

    Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎, 能够处 理HTML, XML, JavaScript, CSS甚⾄纯⽂本。 Thymeleaf旨在提供⼀个优雅的、 ⾼度可维护的创建模板的⽅式。 为了实 现这⼀⽬标, Thymeleaf建⽴...

    thymeleaf Examples: Layouts

    Thymeleaf Examples: Layouts This is an example project containing code used in the "Thymeleaf Layouts" tutorial. The project was created using Spring MVC 4 Quickstart Maven archetype: ...

    thymeleaf中文API

    thymeleaf-3.0.5.RELEASE中文API,Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎,能够处 理HTML,XML,JavaScript,CSS甚⾄纯⽂本。 Thymeleaf旨在提供⼀个优雅的、⾼度可维护的创建模板的⽅式。 为了实 ...

Global site tag (gtag.js) - Google Analytics