當(dāng)前位置：首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

Thymeleaf抽取公共页面片段

發(fā)布時(shí)間：2025/3/20 编程问答 17 豆豆

生活随笔收集整理的這篇文章主要介紹了 Thymeleaf抽取公共页面片段小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

抽取頁(yè)面

項(xiàng)目中，一般把所有的公共頁(yè)面片段都抽取出來
放在一個(gè)獨(dú)立的頁(yè)面中

其他，所有的頁(yè)面根據(jù)需要進(jìn)行引用
參考文檔

th:fragment

抽取公共元素
Name，隨便自定義命名

th:insert

th:replace

th:include

引入公共元素
使用波浪號(hào)、花括號(hào)方式

這兩個(gè)符號(hào)
也可以省略不寫

引入兩種方式

選擇器引入
模板名引入

~{templatename::selector}

模板名::選擇器

~{templatename::fragmentname}

模板名::片段名

頁(yè)面頭部
抽取頁(yè)面的頂部欄

<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/#">[[${session.loginUser}]]</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>

用戶頁(yè)面
引入命名空間

引用頁(yè)面頂部

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

修改完成，刷新頁(yè)面
Ctrl+F9

總結(jié)

以上是生活随笔為你收集整理的Thymeleaf抽取公共页面片段的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。

上一篇： Synchronize对String加锁
下一篇： Thymeleaf引入公共片段方式