JavaEE領(lǐng)域有幾種常用的模板引擎: Jsp, Thymeleaf, Freemarker, Velocity等.對于前端頁面渲染效率來說 JSP 其實還是最快的, Velocity次之.Thymeleaf雖然渲染效率不是很快,但語法比較輕巧.
Thymeleaf 支持html5標準, Thymeleaf頁面無需部署到servlet開發(fā)到服務(wù)器上,以 .html 后綴結(jié)尾,可直接通過瀏覽器就能打開.可完全替代JSP(前后端分離不是很好).
Thymeleaf可以讓美工在瀏覽器查看頁面的靜態(tài)效果,也可以讓程序員在服務(wù)器查看帶數(shù)據(jù)的動態(tài)頁面效果.(支持html原型,在html標簽增加額外的屬性來達到 模板+數(shù)據(jù) 的展示方式).瀏覽器解鎖html時會忽略未定義的標簽屬性,模板可以靜態(tài)運行;當有數(shù)據(jù)返回到頁面時,Thymeleaf標簽會動態(tài)的替換靜態(tài)內(nèi)容,使頁面動態(tài)顯示.
Thymeleaf提供標準和spring標準兩種方言,可以直接套用模板實現(xiàn)JSTL,OGNL表達式效果.提供spring標準方言和一個與springMVC完美集成的可選模塊,可以快速實現(xiàn)表單綁定,屬性編輯器,國際化等功能.
快速入門
1.添加依賴
<dependency>
????<groupId>org.springframework.boot</groupId>
????<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
2.thymeleaf的配置
spring:
??thymeleaf:
????cache:?false
????encoding:?utf-8
????mode:?HTML5
????suffix:?.html
????prefix:?classpath:/templates/
3.模板文件所在位置
index.html
<!DOCTYPE?html>
<html>
<head>
????<title>Thymeleaf?Example</title>
</head>
<body>
<h1?th:text="${message}">Message</h1>
</body>
</html>
最后,用controller去訪問
@Controller
public?class?IndexController?{
????@RequestMapping("/")
????public?String?index(Model?model)?{
????????model.addAttribute("message",?"Hello?Thymeleaf!");
????????return?"index";
????}
}
注意,這邊要用 @Controller
,不能用 @RestController
。
啟動項目,訪問 http://localhost:8080/
更新頁面不生效解決
很多用themeleaf的小伙伴,都會發(fā)現(xiàn)修改了頁面后必須要重啟才能生效,還不如jsp呢,簡直是技術(shù)的倒退!
其實,我們只需要在idea里面設(shè)置一下就解決了,網(wǎng)上很多說加這個那個配置的,很多都是胡扯,根本不是那個原因。
看步驟:
點這個
這兩個
選擇:
On ‘Update’ action: update classes and resources
On frame deactivation: update classes and resources
重啟項目,你就會發(fā)現(xiàn)修改頁面實時更新了,搞定。
thymeleaf常用指令
以下是thymeleaf常用指令的示例,包含前后端代碼。
th:text指令:
前端代碼:
<h1?th:text="${name}">默認名稱</h1>
后端代碼:
@GetMapping("/example")??
public?String?example(@RequestParam?String?name,?Model?model)?{??
????model.addAttribute("name",?name);??
????return?"example";??
}
th:text 還可以拼接,有點類似于vue 比如:
<h1?th:text="${message}?+?'?哈哈哈'">Message</h1>
th:each指令:
前端代碼:
<ul?th:each="item?:?${items}">??
????<li?th:text="${item}"></li>??
</ul>
后端代碼:
@GetMapping("/example")??
public?String?example(Model?model)?{??
????List<String>?items?=?Arrays.asList("Item?1",?"Item?2",?"Item?3");??
????model.addAttribute("items",?items);??
????return?"example";??
}
th:if指令:
前端代碼:
<div?th:if="${condition}">條件為真時顯示</div>
后端代碼:
@GetMapping("/example")??
public?String?example(Model?model)?{??
????boolean?condition?=?true;?//?根據(jù)實際情況設(shè)置條件值??
????model.addAttribute("condition",?condition);??
????return?"example";??
}
th:unless指令:
前端代碼:
<div?th:unless="${condition}">條件為假時顯示</div>
后端代碼:文章來源:http://www.zghlxwxcb.cn/news/detail-683872.html
@GetMapping("/example")??
public?String?example(Model?model)?{??
????boolean?condition?=?false;?//?根據(jù)實際情況設(shè)置條件值??
????model.addAttribute("condition",?condition);??
????return?"example";??
}
?文章來源地址http://www.zghlxwxcb.cn/news/detail-683872.html
到了這里,關(guān)于SpringBoot整合thymeleaf的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!