thymeleaf的fragment例子

fragment介绍

fragment类似于JSP的tag，在html中文件中，可以将多个地方出现的元素块用fragment包起来使用。

定义fragment

新建foot.html文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<footer th:fragment="footDiv">

    the content of footer

</footer>

</html>

fragment的引用

th:insert:保留自己的主标签，保留th:fragment的主标签。
th:replace:不要自己的主标签，保留th:fragment的主标签。
th:include:保留自己的主标签，不要th:fragment的主标签。（官方3.0后不推荐）

新建test.html文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<!--导入片段-->

<div th:insert="footer :: footDiv"></div>

<div th:replace="footer :: footDiv"></div>

<div th:include="footer :: footDiv"></div>

</html>

得到的结果为

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<!--导入片段-->

<div><footer>

    the content of footer

</footer></div>

<footer>

    the content of footer

</footer>

<div>

    the content of footer

</div>

</html

fragment的参数设置

定义：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<div th:fragment="headDiv(showInfo)">

    the content of head!message:[(${showInfo})]

</div>

</html>

调用：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<!--导入片段-->

<div th:include="head :: headDiv('测试')"></div>

</html>

结果：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<!--导入片段-->

<div>

    the content of head!message:测试

</div>

</html>

如果是多个参数的时候例子：

<div th:fragment="frag (onevar,twovar)">

    <p th:text="${onevar} + ' - ' + ${twovar}">...</p>

</div>

按参数定义时的顺序进行传递

<div th:replace="::frag (${value1},${value2})">...</div>

<div th:replace="::frag (onevar=${value1},twovar=${value2})">...</div>

可以不按照参数定义的顺序

<div th:replace="::frag (twovar=${value2},onevar=${value1})">...</div>

fragment的lexible layouts

定义：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head th:fragment="head(title,links,scripts)">

    <title th:replace="${title}">The awesome application</title>

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

    <link href="/static/css/test.css" rel="stylesheet">

    <script type="text/javascript" src="/static/js/jquery.js"></script>

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

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

</head>

</html>

使用：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head th:include="head :: head(~{::title},~{::link},~{::script})">

    <title>html的title</title>

    <link rel="stylesheet" th:href="@{/css/bootstrap.css}">

    <script th:src="@{/js/bootstrap.js}"></script>

</head>

</html>

结果：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

    <title>html的title</title>

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

    <link href="/static/css/test.css" rel="stylesheet">

    <script type="text/javascript" src="/static/js/jquery.js"></script>

    <link rel="stylesheet" href="/css/bootstrap.css">

    <script src="/js/bootstrap.js"></script>

</head>

</html>

注意是link 和script，不是links 和scripts
如果调用的页面没有link或者script ，则指定传入的参数为~{}即可。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head th:include="head :: head(~{::title},~{::link},~{})">

    <title>html的title</title>

    <link rel="stylesheet" th:href="@{/css/bootstrap.css}">

</head>

</html>

thymeleaf的fragment例子的更多相关文章

spring boot:thymeleaf给fragment传递参数的方法(spring boot 2.3.3)
一,thymeleaf如何给fragment传递参数? 1,如果是全局的参数,可以用interceptor中传递非全局参数,可以从controller中传递 2,引用片断时也可以传递参数说明:刘宏 ...
thymeleaf之fragment
MUEAS项目,web前端采用thymeleaf作为展示层.这个view解析器,个人觉得非常不错.简单而且性能也比较好!个人觉得比JSP和freemarker之类,简单易用! 今天简单记录一下frag ...
Thymeleaf+Spring整合
前言这个教程介绍了Thymeleaf与Spring框架的集成,特别是SpringMvc框架. 注意Thymeleaf支持同Spring框架的3.和4.版本的集成,但是这两个版本的支持是封装在thym ...
thymeleaf 专题
Thymeleaf 之内置对象.定义变量.URL参数及标签自定义属性如标题所述,这篇文章主要讲述Thymeleaf中的内置对象(list解析.日期格式化.数字格式化等).定义变量.获取URL的参数 ...
spring+thymeleaf实现表单验证数据双向绑定
前言这个教程介绍了Thymeleaf与Spring框架的集成,特别是SpringMvc框架. 注意Thymeleaf支持同Spring框架的3.和4.版本的集成,但是这两个版本的支持是封装在thym ...
Thymeleaf模板引擎+Spring整合使用方式的介绍
尊重原创,原文地址为:https://www.cnblogs.com/jiangchao226/p/5937458.html 前言这个教程介绍了Thymeleaf与Spring框架的集成,特别是Sp ...
SPRING + THYMELEAF 配置
1.使用的是Spring EL而不是Ognl.2.访问上下文的Bean用${@myBean.doSomething()}3.th:field,th:errors,th:errorclass用于form ...
33.Android之Fragment学习
Fragment Android是在Android 3.0 (API level 11)开始引入Fragment的. 可以把Fragment想成Activity中的模块,这个模块有自己的布局,有自己的 ...
Android之Fragment(碎片)方方面面
Fragment简介碎片(Fragment)是一种可以嵌入到活动当中的UI片段,它能让程序更加合理和充分的利用大屏幕的空间. Fragment的生命周期它与Activity生命周期的关系: 可以看到 ...

随机推荐

TSMBIOS
TSMBIOS Object Pascal language (Delphi or Free Pascal). https://github.com/RRUZ/tsmbios
Redis安装以及Java客户端jedis连接不上相关问题解决
安装步骤 1.由于Redis是由C 语言编写的所以虚拟机编译需要C的编译环境用命令 yum install gcc-c++ 2.用SFTP上传Redis安装包并解压 3.进入Redis源码目录 b ...
一个简单的java程序，用于RabbitMQ日志监控
RabbitMQ的所有日志,都会发给topic类型的exchange “amq.rabbitmq.log” routingKey 有 debug,info,waring,error. 如果接收所有 ...
springboot +redis配置
springboot +redis配置 pom依赖 <dependency> <groupId>org.springframework.boot</groupId> ...
用6个案例说明如何恢复PXC集群
原文链接:https://blog.csdn.net/zengxuewen2045/article/details/51868976 1. 案例一:三个节点,关闭一个由于维护和配置变更等工作需要 ...
c语言——单链表分拆——头插法创建链表，尾插法生成链表
#if 1 #include<stdio.h> #include<stdlib.h> #include<iostream> using namespace std; ...
input.nextLine()的注意事项
若在input.nextInt()和input.nextDouble()后使用input.nextLine(),要先加一个input.nextLine()进行换行
Matlab_spectrogram_短时傅里叶分析_实现与讨论
在语音与音乐处理过程中,常用到短时傅里叶变换(Short Time Fourier Transformation, STFT).在一些学习路径中,STFT也是学习小波之前的预备知识.本文简单实现了 M ...
Python之必备函数
1. lambda 表达式匿名函数(ANONYMOUS FUNCTION)是指一类无需定义标识符(函数名)的函数.通俗来讲,就是它可以让我们的函数,可以不需要函数名. 正常情况下,我们定义一个函数, ...
匹配URL
使用一个不错的正则表达式来配对一个正确的url. string reg = @"(?i)(http://|https://)?(\w+\.){1,3}(com(\.cn)?|cn|net|i ...

thymeleaf的fragment例子

fragment介绍

定义fragment

fragment的引用

fragment的参数设置

fragment的lexible layouts

thymeleaf的fragment例子的更多相关文章

随机推荐

热门专题