SpringBoot2.X整合Thymeleaf


Thymeleaf是適用於Web和獨立環境的現代服務器端Java模板引擎,SpringBoot官方推薦使用的一個模板引擎

如果你對模板和模板引擎沒什么概念的話,可以簡單理解為Thymeleaf是一個高級簡潔的JSP

如果學過MVC設計模式,那么Thymeleaf就是視圖層(view)的主要核心內容

模板引擎是什么

模板引擎是為了使用戶界面與業務數據(內容)分離而產生的,它可以將特定格式的模板和數據通過模板引擎渲染就會生成一個標准的HTML文檔頁面

它最早出現是C#語言用來渲染成.asp,所以它不是什么新鮮事了,Thymeleaf則是Java的一個模板引擎,與Thymeleaf類似的模板引擎還有Velocity和FreeMarker

模板引擎工作原理


按照我自己理解模板引擎只是將模板(Template)和數據(Java Object)渲染成網頁(Html)的工具

JSP知道吧,它里面參雜Java內置對象代碼來進行數據顯示,而Thymeleaf按照我的理解就像去除了Java代碼的簡化版JSP

為什么要整合Thymeleaf

在SpringBoot2.X系列第一篇文章中整合的案例,各位應該有印象我沒有去配置過Tomcat

因為SpringBoot將項目打包成Jar包方式在內部集成的Tomcat運行,傳統JSP是要打成war包才能運行,所以這里不適用JSP必須整合Thymeleaf

使用Thymeleaf有助於前后端協同開發,因為它在無網絡環境下也可以運行,前端程序員便於在靜態頁面查看頁面效果,后端開發者也便於在服務器查看實時的數據交互

Thymeleaf嚴格遵循的mvc設計模式,不用像JSP頁面大量嵌套Java代碼,開發更簡潔

SpringBoot整合Thymeleaf

整合Thymeleaf需要Web模塊和Thymeleaf模塊相應的依賴Jar包

pom.xml

<dependencies>
        <!--thymeleaf模塊依賴-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <!--Web模塊依賴-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
</dependencies>


在SpringBoot Initializer中分別勾選Web和Thymeleaf

整合Thymeleaf的項目結構

SpringBoot整合Thymeleaf的目錄結構
在SpringbootApplication所在的包下所有Bean類會被SpringBoot自動掃描組裝,static目錄是SpringBootyong用來加載CSS,JS,IMG等靜態資源,templates是用來放置html模板文件

ThymeleafController

package com.luojay.springbootthymeleaf.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class ThymeleafController {
    @RequestMapping("/getThymeleaf")
    public String Welcome(){
        return "luojay";
        //此處返回值,對應templates的文件名,SpringBoot根據它找到對應Html
    }
}

@Controller注解是告知SpringBoot此類是控制層需要自動注入,@RequestMapping是映射訪問路徑注解,在localhost:8080之后的路徑就是根據此處寫的

luojay.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>luojay's Thymeleaf</title>
</head>
<body>
    hello,luojay!
</body>
</html>

頁面展示效果

進階的學習案例

上面的入門例子可以說是簡單到不行,有了這個基礎,可以利用網上一些靜態資源整合Thymeleaf搭建好看的頁面,比如登錄界面

文章配套代碼

文章的配套源碼已收錄在我的GitHub倉庫SpringBoot-Study中,點擊閱讀原文可以直達我的Github中的SpringBoot-Study倉庫,如果案例的代碼對你有幫助,歡迎star和fork!
Github:springboot-thymeleaf

登錄頁面源代碼:基於Layui簡約登錄界面


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM