【SpringBoot】 十二、themeleaf 的3种引入页面方式

一、引入前先配置

  thymeleaf:
    cache: false #开发时关闭缓存,不然没法看到实时页面
    prefix: classpath:/templates/
    suffix: .html
    encoding: UTF-8
    mode: HTML5

 

二、创建被引入页面及公共片段

 

三、引入页面及公共片段

在 index.html 的底部引用页面的公共片段companyInfo1和companyInfo2

效果：

 

三种引入方式： 

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>

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

<footer>
&copy; 2011 The Good Thymes Virtual Grocery
</footer>

<div>
&copy; 2011 The Good Thymes Virtual Grocery
</div>

参考博文：https://blog.csdn.net/cold___play/article/details/103463297