之前的時候，我爲了演示Linux配置提交項目執行環境，簡單的整理了一下springboot得相關內容，但是在實際的開發過程中，SpringBoot得使用可不僅僅就是這一點點遍歷而已，在SpringBoot中推薦使用thymeleaf模板引擎，簡單點評價這個模板就是語法簡單，功能更強大
文章首發公衆號：Java架構師聯盟，每日更新技術好文，源碼已經上傳git，大家可以自行下載
所以今天我們來看一下這個強大得模板引擎到底有多強大
添加thymeleaf模板
這裏有兩種創建方式
1.新建springBoot項目
只需要在創建springboot項目的時候，添加thymeleaf即可
2.已經創建得項目中加入thymeleaf模板引擎
要想引入thymeleaf，只需要在pom.xml文件中加入如下依賴就可以了，但是有一個注意點，我在代碼註釋中解釋了
<!-- 提交到tomcat執行，需要添加下方依賴-->
<!--如果你要用springboot本身的tomcat得話，一定要注意記得註釋掉，不然無法啓動-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
<scope>provided</scope>
</dependency>
<!-- 添加Thymeleaf模板，只需要添加這個依賴即可-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
項目編寫
在controller中定義跳轉的頁面
代碼架構：
之前的時候我說過，入口類會自動尋找子包或者平行類，所以初學者要注意以下這個點哦
我這是沿用之前的時候寫的代碼，直接創建了一個thymeleaf展示今天的內容
package com.example.demo.thymeleaf;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
import java.util.Map;
/**
* @author ：biws
* @date ：Created in 2020/12/18 19:43
* @description：在controller中定義跳轉頁面
*/
@Controller
public class HelloController {
@RequestMapping("hello")
@ResponseBody
public String hello() {
return "這是第二種搭建springboot方式";
}
@RequestMapping("testThymeleaf")
public String testThymeleaf(Map map) {
map.put("info", "這是從controller傳到前端界面得數據");
return "index";
}
}
這是第一個優點：會自動去templates文件夾下去找index.html
4.運行，然後訪問項目
輸入http://localhost:8080/testThymeleaf即可訪問index.html
奧對，忘記把index得代碼添加上來了
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>測試thymeleaf模板</title>
</head>
<body>
<p>歡迎來到測試thymeleaf界面</p>
<!--/*@thymesVar id="info" type=""*/-->
<p th:text="${info}"></p>
</body>
</html>
大家可能已經發現了
我在這個代碼中模擬前端返回數據，直接存儲到map中，因爲在寫一個界面有點費勁，畢竟像我這種懶癌患者，哈哈哈哈
而在index中，獲取數據之後，通過info這個id進行獲取
最後展示的結果就是這樣
而區別於傳統得數據獲取方式，thymeleaf有其自己得標籤語法，那我們來看一下都有哪些標籤語法呢？
thymeleaf標籤語法
常用標籤介紹
下面我整理幾種常用得知識點
幾種常用的使用方法
1、賦值、字符串拼接
<p th:text="${collect.description}">description</p>
<span th:text="'Welcome to our application, ' + ${user.name} + '!'">
字符串拼接還有另外一種簡潔的寫法
<span th:text="|Welcome to our application, ${user.name}!|">
2、條件判斷 If/Unless
Thymeleaf中使用th:if和th:unless屬性進行條件判斷，下面的例子中，<a>標籤只有在th:if中條件成立時才顯示：
<a th:if="${myself=='yes'}" > </i> </a>
<a th:unless=${session.user != null} th:href="@{/login}" rel="external nofollow" rel="external nofollow" rel="external nofollow" >Login</a>
th:unless與th:if恰好相反，只有表達式中的條件不成立，纔會顯示其內容。
也可以使用 (if) ? (then) : (else) 這種語法來判斷顯示的內容
3、for 循環
<tr th:each="collect,iterStat : ${collects}">
<th scope="row" th:text="${collect.id}">1</th>
<td >
<img th:src="${collect.webLogo}"/>
</td>
<td th:text="${collect.url}">Mark</td>
<td th:text="${collect.title}">Otto</td>
<td th:text="${collect.description}">@mdo</td>
<td th:text="${terStat.index}">index</td>
</tr>
iterStat稱作狀態變量，屬性有：
index:當前迭代對象的index（從0開始計算）
count: 當前迭代對象的index(從1開始計算)
size:被迭代對象的大小
current:當前迭代變量
even/odd:布爾值，當前循環是否是偶數/奇數（從0開始計算）
first:布爾值，當前循環是否是第一個
last:布爾值，當前循環是否是最後一個
4、URL
URL在Web應用模板中佔據着十分重要的地位，需要特別注意的是Thymeleaf對於URL的處理是通過語法@{…}來處理的。
如果需要Thymeleaf對URL進行渲染，那麼務必使用th:href，th:src等屬性，下面是一個例子
<!-- Will produce 'http://localhost:8080/standard/unread' (plus rewriting) -->
<a th:href="@{/standard/{type}(type=${type})}" rel="external nofollow" >view</a>
<!-- Will produce '/gtvg/order/3/details' (plus rewriting) -->
<a href="details.html" rel="external nofollow" th:href="@{/order/{orderId}/details(orderId=${o.id})}" rel="external nofollow" >view</a>
5、使用thymeleaf佈局
使用thymeleaf佈局非常的方便
<!--定義代碼片段-->
<footer th:fragment="copy">
© 2016
</footer>
<!--在頁面任何地方引入
<!--th:include 和 th:replace區別，include只是加載，replace是替換-->
<body>
<div th:include="footer :: copy"></div>
<div th:replace="footer :: copy"></div>
</body>
<!--返回的HTML如下-->
<body>
<div> © 2016 </div>
<footer>© 2016 </footer>
</body>
下面是一個常用的後臺頁面佈局，將整個頁面分爲頭部，尾部、菜單欄、隱藏欄，點擊菜單隻改變content區域的頁面
<body class="layout-fixed">
<div th:fragment="navbar" class="wrapper" role="navigation">
<div th:replace="fragments/header :: header">Header</div>
<div th:replace="fragments/left :: left">left</div>
<div th:replace="fragments/sidebar :: sidebar">sidebar</div>
<div layout:fragment="content" id="content" ></div>
<div th:replace="fragments/footer :: footer">footer</div>
</div>
</body>
任何頁面想使用這樣的佈局值只需要替換中間的 content模塊即可
<html xmlns:th="http://www.thymeleaf.org" layout:decorator="layout">
<body>
<section layout:fragment="content">
...
也可以在引用模版的時候傳參
<head th:include="layout :: htmlhead" th:with="title='Hello'"></head>
<!--layout 是文件地址，如果有文件夾可以這樣寫 fileName/layout:htmlhead
<!--htmlhead 是指定義的代碼片段 -->
th:fragment="copy"]
好啦，一些基礎得應用這裏基本全涵蓋了，一定要去好好練習一下啊