日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 >

SpringBoot代码复用——thymeleaf提取导航栏并插入或替换元素

發布時間:2025/3/15 44 豆豆
生活随笔 收集整理的這篇文章主要介紹了 SpringBoot代码复用——thymeleaf提取导航栏并插入或替换元素 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

文章目錄

    • 創建通用文件commons
    • 提取導航欄
        • 1.找到導航欄所在代碼塊
        • 2.把導航欄的前端代碼塊移入commons并命名
        • 3.在各個有需求的html文件中使用導航欄組件

創建通用文件commons


注意:commons和所有要用thymeleaf的html文件都應該設置引用:

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd"><html xmlns="http://www.w3.org/1999/xhtml"xmlns:th="http://www.thymeleaf.org">

提取導航欄

1.找到導航欄所在代碼塊

<header class="app-header fixed-top">

往往導航欄會以top、side、bottom命名。

2.把導航欄的前端代碼塊移入commons并命名

<header class="app-header fixed-top" th:fragment="topbar"> <div id="app-sidepanel" class="app-sidepanel" th:fragment="sidebar"> <div class="app-bottom " th:fragment="bottombar">

th:fragment=""設置組件名稱

3.在各個有需求的html文件中使用導航欄組件

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

th:replace=""使用組件,格式為~{組件所在文件路徑::組件名}

總結

以上是生活随笔為你收集整理的SpringBoot代码复用——thymeleaf提取导航栏并插入或替换元素的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。