IDEA激活码
目录：
使用Thymeleaf项目开发中，经常会遇到网页中有大量的重复的内容，此时我们就需要考虑把重复的内容抽取出来，这样就会显得网页不是那么的臃肿。Thymeleaf模板引擎也为我们提供了这种功能。
项目开发中，我们通常会在页面添加一个底边框，用于显示一些版权所有等信息。每个页面都需要显示的那种，此时我们就可以使用 Thymeleaf 模板为我们提供的公共组件抽取功能，来完成这一操作。
举例：如下代码为我们项目中多次重复使用的一段代码，我们需要对该内容就行抽取。
<footer>
© 2011 The Good Thymes Virtual Grocery
</footer>
1.如下是项目中 index.html 页面代码，需要对公共代码抽取
<head>
<meta charset="utf-8">
<title>index页面</title>
</head>
<body>
<div>
<span>省略部分代码</span>
<span>省略部分代码</span>
</div>
<footer>
© 2011 The Good Thymes Virtual Grocery
</footer>
<body>
第一种方式：
①使用th:fragment="片段名"的方式将其抽取成一个公共片段
<head>
<meta charset="utf-8">
<title>index页面</title>
</head>
<body>
<div>
<span>省略部分代码</span>
<span>省略部分代码</span>
</div>
<footer th:fragment="copy">
© 2011 The Good Thymes Virtual Grocery
</footer>
<body>
②.如果user.html页面也用到了这个片段，我们只需通过~{templatename::fragmentname} (模板名::片段名) 的方式引入即可
<head>
<meta charset="utf-8">
<title>user页面</title>
</head>
<body>
<div>
<span>省略部分代码</span>
<span>省略部分代码</span>
</div>
<!--引入抽取的公共片段-->
<div th:insert=“~{index::copy}”></div>
<body>
第二种方式：
①只需要在公共组件添加一个 id 或 class 等只要css 能唯一定位到的属性即可 (此处以 id 为例)
<head>
<meta charset="utf-8">
<title>index页面</title>
</head>
<body>
<div>
<span>省略部分代码</span>
<span>省略部分代码</span>
</div>
<footer id="copy">
© 2011 The Good Thymes Virtual Grocery
</footer>
<body>
②.使用~{templatename::selector} (模板名::选择器) 的方式引入即可
<head>
<meta charset="utf-8">
<title>user页面</title>
</head>
<body>
<div>
<span>省略部分代码</span>
<span>省略部分代码</span>
</div>
<!--引入抽取的公共片段-->
<div th:insert=“~{index :: #copy}”></div>
<body>
备注：我们也可以将公共组件单独写成一个 html ，使用文件名::片段名 或 文件名::选择器 方式引入
No1：使用其他th 属性引入
除去th:insert外，Thymeleaf 在公共片段引入方面，为我们提供了 2个属性可供我们选择，分别是：、th:replace、th:include，通过名称你应该也能够理解。三种引入公共片段的th属性区别如下：
-
th:insert：将公共片段整个插入到声明引入的元素中
-
th:replace：将声明引入的元素替换为公共片段
-
th:include：将被引入的片段的内容包含进这个标签中
<!--公共片段-->
<footer th:fragment="copy">
© 2011 The Good Thymes Virtual Grocery
</footer>
<!--引入方式(可以使用省略~{}的方式，如下：)-->
<div th:insert="index :: copy"></div>
<div th:replace="index :: copy"></div>
<div th:include="index :: copy"></div>
<!--效果-->
<!--th:insert(直接将片段插入到div标签中)-->
<div>
<footer>
© 2011 The Good Thymes Virtual Grocery
</footer>
</div>
<!--th:replace(直接使用片段将div标签替换掉)-->
<footer>
© 2011 The Good Thymes Virtual Grocery
</footer>
<!--th:include(直接将片段中的内容包含在div标签下)-->
<div>
© 2011 The Good Thymes Virtual Grocery
</div>
No2：公共组件支持传参
抽取公共组件后还支持传参，我们可以通过传递参数的方式，来解决部分公用组件的问题。比如通过传参来解决列表项的高亮显示。公共组件该如何传递参数呢？
1. 可以在定义组件时传参，引用时使用参数
<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>
2. 也可以在定义组件时不传参，引用时传参
<div th:fragment="frag">
...
</div>
在引用组件时，去传递参数，如下所示：(下面2种写法等价)
<!--引用组件时传参-->
<div th:replace="文件名::frag (onevar=${value1},twovar=${value2})">
<!--上面写法就等同于 <th:replace> 和 <th:with> 的组合-->
<div th:replace="文件名::frag" th:with="onevar=${value1},twovar=${value2}">
附：Thymeleaf 开发参考手册一份：参考手册链接。Thymeleaf 公共组件的抽取介绍，可参考手册：8.1 Including template fragments 章节。Thymeleaf 组件的传参介绍，可参考手册：8.2 Parameterizable fragment signatures 章节。（以上内容介绍同手册一致，有兴趣你可以参考，你也可以直接看本文介绍）
博主写作不易，来个关注呗
求关注、求点赞，加个关注不迷路 ヾ(◍°∇°◍)ﾉﾞ
博主不能保证写的所有知识点都正确，但是能保证纯手敲，错误也请指出，望轻喷 Thanks♪(･ω･)ﾉ
