Thymeleaf從入門到精通

bigsai發表於2020-07-24

什麼是Thymeleaf

大家好,我是bigsai,今天我們來學習Thymeleaf,如果你對Thymeleaf比較陌生也不要緊,它很容易學習與理解,並有著自己鮮明的特色。


開始之前,我們依舊問一個問題:什麼是Thymeleaf?

  • Thymeleaf 官網是這麼解釋的:Thymeleaf is a modern server-side Java template engine for both web and standalone environments.
  • 譯過來就是:Thymeleaf是適用於Web和獨立環境的現代伺服器端Java模板引擎

模板引擎介紹

模板引擎?你可能第一次聽說模板引擎,估計你會禁不住想問:什麼是模板引擎?

  • 模板引擎(這裡特指用於Web開發的模板引擎)是為了使使用者介面與業務資料(內容)分離而產生的,它可以生成特定格式的文件,用於網站的模板引擎就會生成一個標準的html文件。從字面上理解模板引擎,最重要的就是模板二字,這個意思就是做好一個模板後套入對應位置的資料,最終以html的格式展示出來,這就是模板引擎的作用。
  • 對於模板引擎的理解,可以這樣形象的做一個類比:開會! 相信你在上學初高中時候每次開會都要提前佈置場地、拿小板凳、收拾場地。而你上了大學之後每次開會再也不去大操場了,每次開會都去學校的大會議室,桌子板凳音響主席臺齊全,來個人即可,還可複用……。模板引擎的功能就類似我們的會議室開會一樣開箱即用,將模板設計好之後直接填充資料即可而不需要重新設計整個頁面。提高頁面、程式碼的複用性。

不僅如此,在Java中模板引擎還有很多,模板引擎是動態網頁發展進步的產物,在最初並且流傳度最廣的jsp它就是一個模板引擎。jsp是官方標準的模板,但是由於jsp的缺點比較多也挺嚴重的,所以很多人棄用jsp選用第三方的模板引擎,市面上開源的第三方的模板引擎也比較多,有Thymeleaf、FreeMaker、Velocity等模板引擎受眾較廣。

聽完了模板引擎的介紹,相信你也很容易明白了模板引擎在web領域的主要作用:讓網站實現介面和資料分離,這樣大大提高了開發效率,讓程式碼重用更加容易。

Thymeleaf介紹

上面知曉了模板引擎的概念和功能,你也知道Thymeleaf是眾多模板引擎的一種,你一定會好奇想深入學習Thymeleaf的方方面面。從官方的介紹來看,Thymeleaf的目標很明確:

  • Thymeleaf的主要目標是為您的開發工作流程帶來優雅自然的模板-HTML可以在瀏覽器中正確顯示,也可以作為靜態原型工作,從而可以在開發團隊中加強協作。
  • Thymeleaf擁有適用於Spring Framework的模組,與您喜歡的工具的大量整合以及插入您自己的功能的能力,對於現代HTML5 JVM Web開發而言,Thymeleaf是理想的選擇——儘管它還有很多工作要做。

並且隨著市場使用的驗證Thymeleaf也達到的它的目標和大家對他的期望,在實際開發有著廣泛的應用。Thymeleaf作為被Springboot官方推薦的模板引擎,一定有很多過人和不尋同之處:

  • 動靜分離: Thymeleaf選用html作為模板頁,這是任何一款其他模板引擎做不到的!Thymeleaf使用html通過一些特定標籤語法代表其含義,但並未破壞html結構,即使無網路、不通過後端渲染也能在瀏覽器成功開啟,大大方便介面的測試和修改。
  • 開箱即用: Thymeleaf提供標準和Spring標準兩種方言,可以直接套用模板實現JSTL、 OGNL表示式效果,避免每天套模板、改JSTL、改標籤的困擾。同時開發人員也可以擴充套件和建立自定義的方言。
  • Springboot官方大力推薦和支援,Springboot官方做了很多預設配置,開發者只需編寫對應html即可,大大減輕了上手難度和配置複雜度。

此外,Thymeleaf在曾經還有一次大的版本升級,從Thymeleaf2.0—>Thymeleaf3.0。在Thymeleaf2.0時代,Thymeleaf基於xml實現,雖然它帶來了許多出色強大的功能,但有時會降低效能效率,那個時候Thymeleaf的效能真的太差而被很多人所吐槽帶來了很不好的印象。

但是Thymeleaf3.0對比Thymeleaf2.0有著翻天覆地的變化,幾乎是全部重寫了整個Thymeleaf引擎,在效能、效率上相比Thymeleaf2有了很大改善,能夠滿足更多專案的需求,且Thymeleaf3.0不再基於xml所以在html環境下有著更寬鬆的程式設計環境。

此外,Thymelaf3.0在方言、獨立於Java Servlet API、重構核心API、片段表達等方面有著巨大提升和改善,具體可以參看Thymeleaf3十分鐘參考指南

學習Thymeleaf必知的知識點

Thymeleaf模板的執行離不開web的環境,所以你需要對相關知識學習理解才能更好的有助於你對Thymeleaf的學習和認知。

Springboot

相信你對Springboot都很熟悉,我們使用Thymeleaf大多情況都是基於Springboot平臺的,並且Thymeleaf的發展推廣也離不開Springboot官方得支援,且本文的實戰部分也是基於Springboot平臺。

而Spring Boot是由Pivotal團隊提供的全新框架,其設計目的是用來簡化新Spring應用的初始搭建以及開發過程。該框架使用了特定的方式來進行配置,從而使開發人員不再需要定義樣板化的配置。通過這種方式,Spring Boot致力於在蓬勃發展的快速應用開發領域(rapid application development)成為領導者。

簡而言之,Springboot是當前web開發主流,且其簡化了Spring的配置讓開發者能夠更容易上手Web專案的開發。且Thymeleaf能夠快速整合入Springboot,使用方便快捷。

MVC介紹

我們使用的Thymeleaf模板引擎在整個web專案中起到的作用為檢視展示(view),談到檢視就不得不提起模型(model)以及控制器(view),其三者在web專案中分工和職責不同,但又相互有聯絡。三者組成當今web專案較為流行的MVC架構。

MVC全名是Model View Controller,是模型(model)-檢視(view)-控制器(controller)的縮寫,其中:

  • Model(模型)表示應用程式核心(用來儲存資料供檢視層渲染)。
  • View(檢視)顯示資料,而本篇使用的就是Thymeleaf作為檢視。
  • Controller(控制器)處理輸入請求,將模型和檢視分離。

使用MVC設計模式程式有很多優點,比如降低程式耦合、增加程式碼的複用性、降低開發程式和介面的成本,並且通過這樣分層結構在部署維護能夠提供更大的便捷性。

在Java web體系最流行的MVC框架無疑就是Springmvc框架了,在專案中經常配合模板引擎使用或者提供Restful介面。在下面案例Thymeleaf同樣使用Springmvc作為MVC框架進行控制。

動靜分離

你可能還是不明白什麼才是真正的動靜分離,其實這個主要是由於Thymeleaf模板基於html,字尾也是.html,所以這樣就會產生一些有趣的靈魂。

對於傳統jsp或者其他模板來說,沒有一個模板引擎的字尾為.html,就拿jsp來說jsp的字尾為.jsp,它的本質就是將一個html檔案修改字尾為.jsp,然後在這個檔案中增加自己的語法、標籤然後執行時候通過後臺處理這個檔案最終返回一個html頁面。

瀏覽器無法直接識別.jsp檔案,需要藉助網路(服務端)才能進行訪問;而Thymeleaf用html做模板可以直接在瀏覽器中開啟。開發者充分考慮html頁面特性,將Thymeleaf的語法通過html的標籤屬性來定義完成,這些標籤屬性不會影響html頁面的完整性和顯示。如果通過後臺服務端訪問頁面服務端會尋找這些標籤將服務端對應的資料替換到響應位置實現動態頁面!大體區別可以參照下圖:

上圖的意思就是如果直接開啟這個html那麼瀏覽器會對th等標籤忽視而顯示原始的內容。如果通過服務端訪問那麼服務端將先尋找th標籤將服務端儲存的資料替換到對應位置。具體效果可以參照下圖,下圖即為一個動靜結合的例項。

  • 右上角為動態頁面通過服務端訪問,資料顯示為服務端提供的資料,樣式依然為html的樣式
  • 右下角為靜態頁面可通過瀏覽器直接開啟,資料為初始的資料

動態頁面每次修改開啟都需要重新啟動程式、輸入連結,這個過程其實是相對漫長的。如果介面設計人員用這種方式進行頁面設計時間成本高並且很麻煩,可通過靜態頁面設計樣式,設計完成通過服務端訪問即可達成目標UI的介面和應用,達到動靜分離的效果。這個特點和優勢是所有模板引擎中Thymeleaf所獨有的!

第一個Thymeleaf程式

上面既然簡單介紹了Thymeleaf,下面我們們著手實戰第一個Thymeleaf程式。考慮到Thymeleaf被Springboot官方推薦,並且Springboot已成為javaweb領域必不可少的技術點,我們們就用IDEA基於Springboot構建第一個Thymeleaf程式。Thymeleaf提供了一組Spring整合,使您可以將其用作Spring MVC應用程式中JSP的全功能替代品。對於構建一個完整程式,建立第一個Thymeleaf程式需要以下幾個步驟:

  1. 建立程式,新增依賴
  2. 編寫Controller
  3. 編寫Thymeleaf頁面
  4. 訪問頁面

建立程式,新增依賴

首先,開啟你的IDEA建立新專案,選擇Spring Initializr方式建立Springboot專案 ,然後點選next。具體如下圖所示。


點選next之後,我們進行next 填寫好Group(一般com或者com.xxx)和Aritifact(一般專案名)建立。其他地方沒有特殊情況不需要修改,具體如下圖:

IDEA的編譯器做的很友好,可以直接選擇熱門的依賴而不需要去進行尋找,我們勾選其中Web 模組的Spring web依賴以及Template 模組的Thymeleaf依賴。finish 即可:
當然,如果你建立專案時沒有勾選依賴也不要緊,在pom.xml中新增以下依賴:

<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-web</artifactId>
</dependency>

就這樣,程式建立完畢,依賴也成功新增,你就可以在此基礎上正式開始你的個性化操作。

編寫controller

在編寫Controller和Thymeleaf之前,先讓你看一下最終專案的目錄結構,有個初略的印象和概念:

在其中:

  • pom.xml:是專案中的Maven依賴,因為Springboot使用Maven來管理外部jar包依賴,我們只需填寫依賴名稱配置即可引入該依賴,在本系統中引入Spring web模組(Springmvc)和Thymeleaf的依賴.我們不需要自己去招相關jar包。
  • application.properties: 編寫Springboot與各框架整合的一些配置內容。
  • controller:用來編寫控制器,主要負責處理請求以及和檢視(Thymeleaf)繫結。
  • static:用於存放靜態資源,例如html、JavaScript、css以及圖片等。
  • templates:用來存放模板引擎Thymeleaf(本質依然是.html檔案)

專案基於Springboot框架,且選了Spring web(Springmvc)作為mvc框架,其中Thymeleaf就是v(view)檢視層,我們需要在controller中指定Thymeleaf頁面的url,然後再Model中繫結資料。

我們在com.Thymeleaf檔案下建立controller資料夾,在其中建立urlController.java的controller檔案,檔案內容(程式碼)為:

package com.Thymeleaf.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class urlController {
    @GetMapping("index")//頁面的url地址
    public String getindex(Model model)//對應函式
    {
        model.addAttribute("name","bigsai");
        return "index";//與templates中index.html對應
    }
}

上述程式碼就是一個完整的controller。部分含義如下:

  • @controller 註解的意思就是宣告這個java檔案為一個controller控制器。
  • @GetMapping("index") 其中@GetMapping的意思是請求的方式為get方式(即可通過瀏覽器直接請求),而裡面的index表示這個頁面(介面)的url地址(路徑)。即在瀏覽器對專案網頁訪問的地址。
  • getindex() 是@GetMapping("index")註解對應的函式,其型別為String型別返回一個字串,引數Model型別即用來儲存資料供我們Thymeleaf頁面使用。
  • model.addAttribute("name","bigsai") 就是Model存入資料的書寫方式,Model是一個特殊的類,相當於維護一個Map一樣,而Model中的資料通過controller層的關聯繫結在view層(即Thymeleaf中)可以直接使用。
  • return "hello":這個index就是在templates目錄下對應模板(本次為Thymeleaf模板)的名稱,即應該對應hello.html這個Thymeleaf檔案(與頁面關聯預設規則為:templates目錄下返回字串.html)。

編寫Thymeleaf頁面

我們們在專案的resources目錄下的templates資料夾下面建立一個叫index.html的檔案,我們們在這個html檔案中的<html>標籤修改為<html xmlns:th="http://www.thymeleaf.org">這樣在Thymeleaf中就可以使用Thymeleaf的語法和規範啦。

對於第一個Thymelaf程式,你只需將index.html檔案改成這樣即可:

<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>title</title>
</head>
<body>
hello 第一個Thymeleaf程式
<div th:text="${name}">name是bigsai(我是離線資料)</div>
</body>
</html>

你可能會對<div th:text="${name}">name是bigsai(我是離線資料)</div>感到陌生,這個標籤中的th:text="${name}"就是Thymeleaf取值的一個語法,這個值從後臺渲染而來(前面controller中在Model中存地值),如果沒網路(直接開啟html檔案)的時候靜態資料為:name是bigsai(我是離線資料)。而如果通過網路訪問那麼內容將是前面在controller的Model中儲存的bigsai

啟動程式

這樣寫好之後我們們執行這個Springboot程式。通過網路訪問http://localhost:8080/index


上圖左側為直接開啟的靜態頁面,而右側是通過網路訪問服務端返回的動態介面,可以看的到,介面的內容和我們預期一致,左右兩側也正是靜動態頁面的兩個代表。

通過以上的步驟,你就完成了第一個Thymeleaf程式並且能夠成功執行。入門便悄然開始!

Thymeleaf語法詳解

上面雖然完成了第一個Thymeleaf程式,但是那樣遠遠滿足不了我們在專案中使用Thymeleaf,所以我們要對Thymeleaf的語法規則進行更詳細的學習。

配置

雖然Springboot官方對Thymeleaf做了很多預設配置,但我們們引入Thymeleaf的jar包依賴後很可能根據自己特定需求進行更細化的配置,例如頁面快取、字型格式設定等等。

Springboot官方提供的配置內容有以下:

# THYMELEAF (ThymeleafAutoConfiguration)
spring.thymeleaf.cache=true # Whether to enable template caching.
spring.thymeleaf.check-template=true # Whether to check that the template exists before rendering it.
spring.thymeleaf.check-template-location=true # Whether to check that the templates location exists.
spring.thymeleaf.enabled=true # Whether to enable Thymeleaf view resolution for Web frameworks.
spring.thymeleaf.enable-spring-el-compiler=false # Enable the SpringEL compiler in SpringEL expressions.
spring.thymeleaf.encoding=UTF-8 # Template files encoding.
spring.thymeleaf.excluded-view-names= # Comma-separated list of view names (patterns allowed) that should be excluded from resolution.
spring.thymeleaf.mode=HTML # Template mode to be applied to templates. See also Thymeleaf's TemplateMode enum.
spring.thymeleaf.prefix=classpath:/templates/ # Prefix that gets prepended to view names when building a URL.
spring.thymeleaf.reactive.chunked-mode-view-names= # Comma-separated list of view names (patterns allowed) that should be the only ones executed in CHUNKED mode when a max chunk size is set.
spring.thymeleaf.reactive.full-mode-view-names= # Comma-separated list of view names (patterns allowed) that should be executed in FULL mode even if a max chunk size is set.
spring.thymeleaf.reactive.max-chunk-size=0 # Maximum size of data buffers used for writing to the response, in bytes.
spring.thymeleaf.reactive.media-types= # Media types supported by the view technology.
spring.thymeleaf.servlet.content-type=text/html # Content-Type value written to HTTP responses.
spring.thymeleaf.suffix=.html # Suffix that gets appended to view names when building a URL.
spring.thymeleaf.template-resolver-order= # Order of the template resolver in the chain.
spring.thymeleaf.view-names= # Comma-separated list of view names (patterns allowed) that can be resolved.

上面的配置有些我們可能不常使用,因為Springboot官方做了預設配置大部分能夠滿足我們的使用需求,但如果你的專案有特殊需求也需要妥善使用這些配置。

比如spring.thymeleaf.cache=false是否允許頁面快取的配置,我們在開發時候要確保頁面是最新的所以需要禁用快取;而在上線運營時可能頁面不常改動為了減少服務端壓力以及提升客戶端響應速度會允許頁面快取的使用。

再比如在開發雖然我們大部分使用UTF-8多一些,我們可以使用spring.thymeleaf.encoding=UTF-8來確定頁面的編碼,但如果你的專案是GBK編碼就需要將它改成GBK。

另外Springboot預設模板引擎檔案是放在templates目錄下:spring.thymeleaf.prefix=classpath:/templates/,如果你有需求將模板引擎也可修改配置,將templates改為自己需要的目錄。同理其他的配置如果需要自定義化也可參照上面配置進行修改。

常用標籤

我們們上面知道Thymeleaf通過特殊的標籤來尋找屬於Thymeleaf的部分,並渲染該部分內容,而除了上面展示過的th:text之外還有很多常用標籤,並且Thymeleaf也主要通過標籤來識別替換對應位置內容,Thymeleaf標籤有很多很多,功能也很豐富,這裡列舉一些比較常用的標籤如下:

標籤 作用 示例
th:id 替換id <input th:id="${user.id}"/>
th:text 文字替換 <p text:="${user.name}">bigsai</p>
th:utext 支援html的文字替換 <p utext:="${htmlcontent}">content</p>
th:object 替換物件 <div th:object="${user}"></div>
th:value 替換值 <input th:value="${user.name}" >
th:each 迭代 <tr th:each="student:${user}" >
th:href 替換超連結 <a th:href="@{index.html}">超連結</a>
th:src 替換資源 <script type="text/javascript" th:src="@{index.js}"></script>

連結表示式: @{…}

上面我們已經學習到Thymeleaf是一個基於html的模板引擎,但是我們還是需要加入特定標籤來宣告和使用Thymeleaf的語法。我們需要在Thymeleaf的頭部加Thymeleaf標識:

<html xmlns:th="http://www.thymeleaf.org">

在Thymeleaf 中,如果想引入連結比如link,href,src,需要使用@{資源地址}引入資源。其中資源地址可以static目錄下的靜態資源,也可以是網際網路中的絕對資源。

引入css

 <link rel="stylesheet" th:href="@{index.css}">

引入JavaScript:

 <script type="text/javascript" th:src="@{index.js}"></script>

超連結:

<a th:href="@{index.html}">超連結</a>

這樣啟動程式訪問頁面,頁面的內容就自動修改成標準html語法格式的內容:

變數表示式: ${...}

在Thymeleaf中可以通過${…}進行取值,這點和ONGL表示式語法一致。
例如我們們建立這麼一個物件:

public class user {
 
    private String name;
    private  int age;
    private  String detail;

    public user(String name, int age, String detail) {
        this.name = name;
        this.age = age;
        this.detail = detail;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public int getAge() {
        return age;
    }
    public void setAge(int age) {
        this.age = age;
    }
    public String getDetail() {
        return detail;
    }
    public void setDetail(String detail) {
        this.detail = detail;
    }
}

我們們為了測試先在Model中添一些資料:

 @GetMapping("index")//頁面的url地址
 public String getindex(Model model)//對應函式
  {
     user user1=new user("bigsai",22,"一個幽默且熱愛java的社會青年");
     List<String>userList=new ArrayList<>();
     userList.add("zhang san 66");
     userList.add("li si 66");
     userList.add("wang wu 66");
     Map<String ,String>map=new HashMap<>();
     map.put("place","博學谷");
     map.put("feeling","very well");
     //資料新增到model中
     model.addAttribute("name","bigsai");//普通字串
     model.addAttribute("user",user1);//儲存javabean
     model.addAttribute("userlist",userList);//儲存List
     model.addAttribute("map",map);//儲存Map
     return "index";//與templates中index.html對應
  }

取普通字串:
如果在controller中的Model直接儲存某字串,我們可以直接${物件名}進行取值。完整程式碼如下:

<h2>普通字串</h2>
<table border="0">
    <tr>
        <td th:text="'我的名字是:'+${name}"></td>
    </tr>
</table>

執行結果為:

取JavaBean物件:
取JavaBean物件也很容易,因為JavaBean自身有一些其他屬性,所以我們們就可以使用${物件名.物件屬性}或者${物件名['物件屬性']}來取值,這和JavaScript語法是不是很相似呢!除此之外,如果該JavaBean如果寫了get方法,我們們也可以通過get方法取值例如${物件.get方法名}完整程式碼如下:

<h2>JavaBean物件</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr>
        <td>介紹</td>
        <td th:text="${user.name}"></td>
    </tr>
    <tr>
        <td>年齡</td>
        <td th:text="${user['age']}"></td>
    </tr>
    <tr>
        <td>介紹</td>
        <td th:text="${user.getDetail()}"></td>
    </tr>
</table>

執行結果為:

取List集合(each):
因為List集合是個有序列表,裡面內容可能不止一個,你需要遍歷List對其中物件取值,而遍歷需要用到標籤:th:each,具體使用為 <tr th:each="item:${userlist}">,其中item就相當於遍歷每一次的物件名,在下面的作用域可以直接使用,而userlist就是你在Model中儲存的List的名稱。完整的程式碼為:

<h2>List取值</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${userlist}">
        <td th:text="${item}"></td>
    </tr>
</table>

執行結果為:

直接取Map:
很多時候我們不存JavaBean而是將一些值放入Map中,再將Map存在Model中,我們就需要對Map取值,對於Map取值你可以${Map名['key']}來進行取值。也可以通過${Map名.key}取值,當然你也可以使用${map.get('key')}(java語法)來取值,完整程式碼如下:

<h2>Map取值</h2>
<table bgcolor="#8fbc8f" border="1">
    <tr>
        <td>place:</td>
        <td th:text="${map.get('place')}"></td>
    </tr>
    <tr>
        <td>feeling:</td>
        <td th:text="${map['feeling']}"></td>
    </tr>
</table>

執行結果為:

遍歷Map:
如果說你想遍歷Map獲取它的key和value那也是可以的,這裡就要使用和List相似的遍歷方法,使用th:each="item:${Map名}"進行遍歷,在下面只需使用item.keyitem.value即可獲得值。完整程式碼如下:

<h2>Map遍歷</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${map}">
        <td th:text="${item.key}"></td>
        <td th:text="${item.value}"></td>
    </tr>
</table>

選擇變數表示式: *{...}

變數表示式不僅可以寫成${...},而且還可以寫成*{...}

但是,有一個重要的區別:星號語法對選定物件而不是整個上下文評估表示式。也就是說,只要沒有選定的物件,美元(${…})和星號(*{...})的語法就完全一樣。

什麼是選定物件?使用th:object屬性的表示式的結果。就可以選定物件,具體例項如下:

<div th:object="${user}">
    <p>Name: <span th:text="*{name}">賽</span>.</p>
    <p>Age: <span th:text="*{age}">18</span>.</p>
    <p>Detail: <span th:text="*{detail}">好好學習</span>.</p>
</div>

當然*{…}也可和${…}混用。上面的程式碼如果不使用選定物件,完全等價於:

<div >
    <p>Name: <span th:text="*{user.name}">賽</span>.</p>
    <p>Age: <span th:text="${user.age}">18</span>.</p>
    <p>Detail: <span th:text="${user.detail}">好好學習</span>.</p>
</div>

執行結果為:

訊息表達: #{...}

文字外部化是從模板檔案中提取模板程式碼的片段,以便可以將它們儲存在單獨的檔案(通常是.properties檔案)中,文字的外部化片段通常稱為“訊息”。通俗易懂得來說#{…}語法就是用來讀取配置檔案中得資料的。在Thymeleaf你可以使用#{...}語法獲取訊息,具體例項程式碼如下:
首先在templates目錄下建立home.properties中寫入以下內容:

bigsai.nane=bigsai
bigsai.age=22
province=Jiang Su

application.properties中加入以下內容:

spring.messages.basename=templates/home

這樣我們就可以在Thymeleaf中讀取配置的檔案了,完整程式碼如下:

<h2>訊息表達</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr>
    <td>name</td>
    <td th:text="#{bigsai.name}"></td>
    </tr>
    <tr>
    <td>年齡</td>
    <td th:text="#{bigsai.age}"></td>
    </tr>
    <tr>
    <td>province</td>
    <td th:text="#{province}"></td>
    </tr>
</table>

執行結果為:

總結

到這裡本次Thymeleaf的入門學習就結束了,通過本次學習你可能更深入瞭解了Thymeleaf以及模板引擎,也對Thymeleaf的動靜分離、開箱即用的一些特性估計有了更深入的瞭解。你也具備Thymeleaf的基本使用能力,能夠用Thymeleaf進行網頁的快速開發……

但Thymeleaf的內容絕非只有這麼一點點,本篇旨在帶你從一個對Thymeleaf概念為零的狀態到一個能夠較為清晰明瞭的認識和使用Thymeleaf,對於Thymeleaf的內容遠遠不止上面所涉及到的,對於一些算術運算、條件表示式等等其他內容還需要你自己到Thymeleaf官網去學習研究。

Thymeleaf是一種Java模板引擎,被Springboot官方推薦,大大提高開發效率,提高程式碼複用率。雖然在當今Ajax更為流行,但對於後端開發工程師掌握Thymeleaf,擁有快速開發網頁能力,還是很有必要的!本篇就到這裡了,我們下次再見!

歡迎關注微信公眾號:bigsai一個有趣的程式設計師,更多內容待分享,期待您的關注!

相關文章