1. 程式人生 > 實用技巧 >thymeleaf公共頁面元素抽取

thymeleaf公共頁面元素抽取

1、抽取公共片段
<div th:fragment="copy">
  2011 The Good Thymes Virtual Grocery
</div>


2、引入公共片段
<div th:insert="~{footer :: copy}"></div>
~{templatename::selector}:模板名::選擇器
~{templatename::fragmentname}:模板名::片段名


或者:

<div id="copy1">
&copy; 2011 The Good Thymes Virtual Grocery
</div
> <div th:insert="footer :: #copy"></div>

【注意】

insert的公共片段在div標籤中
如果使用th:insert等屬性進行引入,可以不用寫~{}:
行內寫法可以加上:[[~{}]];[(~{})];

3、三種引入公共片段的th屬性:

th:insert:將公共片段整個插入到宣告引入的元素中

th:replace:將宣告引入的元素替換為公共片段

th:include:將被引入的片段的內容包含進這個標籤中

<footer th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</footer> 引入方式 <div th:insert="footer :: copy"></div> <div th:replace="footer :: copy"></div> <div th:include="footer :: copy"></div> 效果 insert: <div> <footer> &copy; 2011 The Good Thymes Virtual Grocery </footer> </div> replace:
<footer> &copy; 2011 The Good Thymes Virtual Grocery </footer> include: <div> &copy; 2011 The Good Thymes Virtual Grocery </div>