一、抽取公共片段

  • th:fragment  给片段命名

将公共片段抽取出来,并在顶级标签内使用th:fragment给该片段命名。

例如:将公共片段抽取出来放到comment/bar.html中:

     

<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0" th:fragment="topbar">
  <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">Company name</a>
  <input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">
  <ul class="navbar-nav px-3">
    <li class="nav-item text-nowrap">
      <a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">Sign out</a>
    </li>
  </ul>
</nav>

这样我们就抽取了一个名叫topbar的公共片段。

二、引入公共片段

1.三种引入片段的方式:

  • th:insert :将公共片段插入到声明引入的标签中
  • th:replace:将公共片段替换掉声明引入的标签
  • th:include:将公共片段中的内容包含进声明引入的标签内。

这三中引入的效果如下:

公共片段:
<footer th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</footer>

th:insert :

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

效果:
<div>
<footer>
&copy; 2011 The Good Thymes Virtual Grocery
</footer>
</div>

th:replace:

<div th:replace="footer :: copy"></div>
效果:
<footer>
&copy; 2011 The Good Thymes Virtual Grocery
</footer>

th:include:

<div th:include="footer :: copy"></div>
效果:
<div>
&copy; 2011 The Good Thymes Virtual Grocery
</div>

2.引入片段的表达式

在上边例子中我们可能有疑问 footer :: copy 这是什么意思?

其实这是一种引入片段的表达式之一,下面我们讲两种引入片段的表达式。

(1) 通过片段名引入片段的表达式: ~{模板名::片段名}

  如我们需要引入上边第一部分演示的片段,我们需要这样写

<div th:replace="~{commons/bar::topbar}"></div>

注意 ~{}可以省略,开发中常常不会写~{}的方式来引入,而是通过下边这种,更加简洁。但是如果是行内写法,则必须加上~{},例如  [[~{}]]  或  [(~{  })]

<div th:replace="commons/bar::topbar"></div>

(2)通过选择器引入片段的表达式:~{模板名::选择器}

例如引入id为user的片段:

<div th:replace="commons/bar::#user"></div>

#号为id选择器

三、引用片段并传参

1.传递参数

只需要在表达式后边跟个小括号即可传递参数,小括号内通过键值对的方式设置值(key=value)

<div th:replace="commons/bar::topbar(username='zhangsan')"></div>

2.获取参数

在目标页面(引用片段表达式中模板名对应的页面)通过变量表达式${} 获取值即可。

<h4 th:text="${username}"></h4>

th:insert、th:replace、th:include抽取和引用页面公共片段、传参等的更多相关文章

  1. 关于thymeleaf th:replace th:include th:insert 的区别

    关于thymeleaf th:replace th:include th:insert 的区别    th:insert   :保留自己的主标签,保留th:fragment的主标签.    th:re ...

  2. MYSQL开发性能研究——INSERT,REPLACE,INSERT-UPDATE性能比较

    一.为什么要有这个实验 我们的系统是批处理系统,类似于管道的架构.而各个数据表就是管道的两端,而我们的程序就类似于管道本身.我们所需要做的事情无非就是从A表抽取数据,经过一定过滤.汇总等操作放置到B表 ...

  3. MyBatis_tp50_动态sql_sql标签_抽取可重用的sql片段_使用include标签进行引用

    笔记要点出错分析与总结 include内部使用自定的属性,之能使用$ {}来取值 ,#{}不能用 工程组织数据库组织0.重新修改Bean类1.定义接口 public interface Employe ...

  4. sqlite "insert or replace" 和 "insert or ignore" 用法

    insert or replace:如果不存在就插入,存在就更新insert or ignore:如果不存在就插入,存在就忽略只对UNIQUE约束的字段起作用.举例:建表:CREATE TABLE T ...

  5. Mysql INSERT、REPLACE、UPDATE的区别

    用于操作数据库的SQL一般分为两种,一种是查询语句,也就是我们所说的SELECT语句,另外一种就是更新语句,也叫做数据操作语句.言外之意,就是对数据进行修改.在标准的SQL中有3个语句,它们是INSE ...

  6. Sqlite执行insert or ignore 或insert or replace语句。

    Sqlite执行insert or ignore 或insert or replace语句. ,); ,); 上面的第一条语句是每次执行时,如果不存在,则添加,如果存在,则更新. 上面的第二条语句是每 ...

  7. 转载:mysql 操作总结 INSERT和REPLACE

    转自:http://www.jb51.net/article/19411.htm   用于操作数据库的SQL一般分为两种,一种是查询语句,也就是我们所说的SELECT语句,另外一种就是更新语句,也叫做 ...

  8. mybatis动态sql中的sql标签——抽取可重用的sql片段

    1.用<sql>标签抽取可重用的sql片段 <!-- 抽取可重用的SQL片段,方便后面引用           1.sql抽取,经常将要查询的列名,或者插入用的列名,之后方便引用   ...

  9. C++ map.insert 传参类型不同,构造/析构次数不同

    1. 传参方式 使用 insert 为 map 插值时,insert 的传参包含以下几种可能: make_pair 生成对象 pair(key_type, value_type) 生成对象 pair( ...

随机推荐

  1. 关于YiII框架的扩展memcache中set设置时间就get查询失效的解决方案(版本是1.1.20)

    0x01 前言 在使用Yii框架的扩展memcache缓存的时候,存储数据有一个set方法,来看一下set方法的原型: public boolean set(string $id, mixed $va ...

  2. 手脱ASPack2.12壳(练习)

    俗话说柿子挑软的捏,练习脱壳还得用加密壳脱 0x01 准备 1.OD 2.ASPack加壳软件 0x02 脱壳实战 查一下壳 OD载入 第一个call,F7进去 第二个call也是F7进去 之后往下单 ...

  3. 5.PHP与Web页面交互

    PHP与Web页面交互 PHP中提供了两种与Web页面交互的方法,一种是通过Web表单提交数据,另一种是通过URL参数传递. 表单提交用户名字和密码: <form name "form ...

  4. pr2019快键键

    pr快捷键 平时用到就更新一下(持续更新),算是日积月累吧.虽然是pr2019,但是其他的版本估计差不多 视频剪辑的时候,快速预览--L(英文输入法).按一次,速度*2,如果想恢复原来速度,按空格键暂 ...

  5. 你管这破玩意叫CPU?

    每次回家开灯时你有没有想过,用你按的开关实际上能打造出 复杂的 CPU来,只不过需要的数量可能比较多,也就几十亿个吧. 伟大的发明 过去200年人类最重要的发明是什么?蒸汽机?电灯?火箭?这些可能都不 ...

  6. [bug] docker: Error response from daemon: Conflict. The container name "/xx" is already in use

    改名.删除或重启容器 参考 https://www.cnblogs.com/youxin/p/12993816.html

  7. [bug] VMvare 虚拟机磁盘空间耗尽

    问题 VMvare虚拟机文件默认创建在C盘,装大程序的时,空间用尽就会报错,此时补救的办法是把虚拟机文件复制到空间足够的盘,再重新打开 最好一开始就选再有足够空间的盘里创建虚拟机 参考 https:/ ...

  8. 置的测试文件的大小一定要大过你的内存(最佳为内存的两倍大小),不然linux会给你的读写的内容进行缓存,会使数值非常不准确。

    使用iozone测试磁盘性能   IOzone是一个文件系统测试基准工具.可以测试不同的操作系统中文件系统的读写性能.可以通过 write, re-write, read, re-read, rand ...

  9. centos7下iperf的安装

    场景: 1.系统centos7.0-123,该版本下的网络测试工具iperf3 下载gz包#wget http://downloads.es.net/pub/iperf/iperf-3.0.6.tar ...

  10. Linux ll查看文件属性详解-软硬链接详解

    Linux文件属性及类型 [root@localhost ~]# ll anaconda-ks.cfg 文件类型 权限 硬连接数 文件的大小 文件的创建,修改时间 - rw-------. 1 roo ...