MUEAS项目,web前端采用thymeleaf作为展示层。这个view解析器,个人觉得非常不错。简单而且性能也比较好!个人觉得比JSP和freemarker之类,简单易用!

今天简单记录一下fragment的使用,这个类是JSP的tag,但是确非常简单。直接在html文件中,将自己觉得可能在多个地方出现的元素块用fragment包起来!

例如:

 <!DOCTYPE html>
<html>
<head>
...
</head>
<body>
<div th:fragment="footer">
&copy; 2013 Footer
</div>
</body>
</html>

在使用的地方,再用include标签将其引入即可!

例如:

 <!DOCTYPE html>
<html>
<head>
<!--/* Each token will be replaced by their respective titles in the resulting page. */-->
<title layout:title-pattern="$DECORATOR_TITLE - $CONTENT_TITLE">Task List</title>
...
</head>
<body>
<!--/* Standard layout can be mixed with Layout Dialect */-->
<div th:replace="fragments/header :: header">
...
</div>
<div class="container">
<div layout:fragment="content">
<!-- ============================================================================ -->
<!-- This content is only used for static prototyping purposes (natural templates)-->
<!-- and is therefore entirely optional, as this markup fragment will be included -->
<!-- from "fragments/header.html" at runtime. -->
<!-- ============================================================================ -->
<h1>Static content for prototyping purposes only</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Praesent scelerisque neque neque, ac elementum quam dignissim interdum.
Phasellus et placerat elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Praesent scelerisque neque neque, ac elementum quam dignissim interdum.
Phasellus et placerat elit.
</p>
</div>
<div th:replace="fragments/footer :: footer">&copy; 2014 The Static Templates</div>
</div>
</body>
</html>

注意:th:fragment定义的片段,在需要的地方,可以用th:include或者th:replace进行带入!

还有,所有的fragment可以写在一个文件里面,也可以单独存在。可以是一个html文件中的一部分。只要你需要,带上th:fragment的标签进行定义,让其为一个fragment即可。有点需要注意的是,片段所在的文件的路径,要用“/”分开路径,根路径为templates所在的路径。

比如:

 <body>
<div class="container">
<div th:include="exam/special/geeker/geeker::geeker-base-header"></div>
<div class="geeker-content">
<div th:include="exam/special/geeker/geeker::geeker-base-left"></div>
<div class="geeker-main">
</div>
<div class="geeker-right">
</div>
</div>
</div>
</body>

是不是很简单易用?我觉得很不错!

thymeleaf之fragment的更多相关文章

  1. thymeleaf的fragment例子

    fragment介绍 fragment类似于JSP的tag,在html中文件中,可以将多个地方出现的元素块用fragment包起来使用. 定义fragment 新建foot.html文件 <!D ...

  2. spring boot:thymeleaf给fragment传递参数的方法(spring boot 2.3.3)

    一,thymeleaf如何给fragment传递参数? 1,如果是全局的参数,可以用interceptor中传递 非全局参数,可以从controller中传递 2,引用片断时也可以传递参数 说明:刘宏 ...

  3. Thymeleaf+Spring整合

    前言 这个教程介绍了Thymeleaf与Spring框架的集成,特别是SpringMvc框架. 注意Thymeleaf支持同Spring框架的3.和4.版本的集成,但是这两个版本的支持是封装在thym ...

  4. SPRING + THYMELEAF 配置

    1.使用的是Spring EL而不是Ognl.2.访问上下文的Bean用${@myBean.doSomething()}3.th:field,th:errors,th:errorclass用于form ...

  5. thymeleaf 专题

    Thymeleaf 之 内置对象.定义变量.URL参数及标签自定义属性 如标题所述,这篇文章主要讲述Thymeleaf中的内置对象(list解析.日期格式化.数字格式化等).定义变量.获取URL的参数 ...

  6. spring+thymeleaf实现表单验证数据双向绑定

    前言 这个教程介绍了Thymeleaf与Spring框架的集成,特别是SpringMvc框架. 注意Thymeleaf支持同Spring框架的3.和4.版本的集成,但是这两个版本的支持是封装在thym ...

  7. Thymeleaf模板引擎+Spring整合使用方式的介绍

    尊重原创,原文地址为:https://www.cnblogs.com/jiangchao226/p/5937458.html 前言 这个教程介绍了Thymeleaf与Spring框架的集成,特别是Sp ...

  8. springboot thymeleaf【转】【补】

    thymeleaf模板 https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html 1.引入thymeleaf依赖 <!-- ...

  9. Springboot:thymeleaf模板(八)

    存放位置:resources\templates 访问方式:通过Controller请求访问,不可直接访问(相当于web项目的WEB-INF目录) 环境依赖: <!--thymeleaf模板支持 ...

随机推荐

  1. magento转移服务器和magento建立多站点总结

    magento转移服务器和magento建立多站点总结第一. 我们首先要做的就是把服务器上的magento转移到本地上来.详细步骤:1. 直接用magento的备份系统把网上数据库备份.如图:2. 数 ...

  2. 第二个Sprint冲刺第二天

    讨论地点:宿舍 讨论成员:邵家文.李新.朱浩龙.陈俊金 任务:解决了第二个Sprint冲刺第一天遇到的错误. 燃尽图: 遇到的问题: 解决之后: 开发感悟:最近一直在写代码,都很少外出活动了,不知不觉 ...

  3. js控制tr 隐藏 显示

    tr td 外面不要套div <tr> <td>排期确定结果: </td> <td> <label class="liradio&quo ...

  4. 【题解】【数组】【Leetcode】Merge Sorted Array

    Given two sorted integer arrays A and B, merge B into A as one sorted array. Note: You may assume th ...

  5. 帝国cms 灵动标签

    [e:loop={栏目ID/专题ID,显示条数,操作类型,只显示有标题图片,附加SQL条件,显示排序}] <a href="<?=$bqsr[titleurl]?>&quo ...

  6. Codeforces Round #280 (Div. 2) A B C 暴力 水 贪心

    A. Vanya and Cubes time limit per test 1 second memory limit per test 256 megabytes input standard i ...

  7. 软件工程课程作业(二)--四则运算2改进版(c++)

    题目要求: 1.避免题目重复 2.可定制(数量/打印方式) 3.可以控制下列参数 (1)是否有乘除法 (2)是否有括号 (3)数值范围 (4)加减有无负数 (5)除法有无余数 关键设计思想: oper ...

  8. exit()和_exit()函数

    进程就好比人一样有其生命,我们通过fork()函数来创建一个进程,那么我们又是如何来中止进程呢. 进程退出 1.在Linux中任何让一个进程退出 进程退出表示进程即将结束.在Linux中进程退出分为了 ...

  9. timus 1109 Conference(二分图匹配)

    Conference Time limit: 0.5 secondMemory limit: 64 MB On the upcoming conference were sent M represen ...

  10. 越狱Season 1-Episode 1: the pilot

    the pilot: 美国电视剧新剧开播都会有一个试播来测试观众对新剧的接受程度,以此来决定是否再继续播下去,也可以说是一个开端,第一集,试播 -Tattoo Artist: That's it. t ...