1. 程式人生 > >Thymeleaf學習筆記(一)

Thymeleaf學習筆記(一)

一:開啟Thymeleaf

初學web框架時候大家都常常使用JSP作為SSM架構的前端渲染,但是越來越多的人選擇使用HTML5作為前端開發的主要手段,這時候JSP的前後端分離就顯得不是很適合,大家都是用Thymeleaf、freemarker等模板引擎作為前後端分離及渲染的框架。其實專業術語說起來很讓你陌生,當轉化為普通話的時候就是這樣理解的,JSP的優點是什麼?跨平臺,可擴充套件,JSTL表示式等等。Thymeleaf就是讓你把以.html為字尾的檔案當作.jsp為字尾的使用,從而讓你回到你所熟悉的SSM開發。
使用Thymeleaf的方法很簡單。而現在比較常用的是與SpringBoot結合,只需要三步
1:引入依賴

    使用Maven時候為
    <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    使用Gradle請使用
    ext ['thymeleaf.version'] = '3.0.3.RELEASE'
    dependencies {
        compile('org.springframework.boot:spring-boot-starter-thymeleaf')
    }

2:開啟spring.thymeleaf

#在配置檔案中配置
#開發時關閉快取,不然沒法看到實時頁面
spring.thymeleaf.cache=false
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.mode=HTML5

跟蹤原始碼,我們發現,在自動配置類中,
這裡寫圖片描述
這個自動配置類配置了

//配置模板解析器的
DefaultTemplateResolverConfiguration-->TemplateResolver
//主要是配置是由什麼解析器來解析的,預設配置為HTML

這裡寫圖片描述
通過
AbstractTemplateResolverConfiguration中的checkTemplateLocationExists()方法,獲取字首,然後去字首中查詢是否由.html字尾的檔案。字首預設配置為classpath:/templates/這也就是我們需要在template資料夾中配置.html檔案的原因,當然你也可以動過在配置檔案.properties中更改屬性spring.thymeleaf.prefix=xxx來更改預設的配置路徑。字首字尾都是在.properties檔案中獲取的。

//配置Servlet的
Thymeleaf2ViewResolverConfiguration-->Servlet

配置解析器Thymeleaf2ViewResolverConfiguration
配置模板引擎: setTemplateEngine(final ITemplateEngine templateEngine)

//配置模板引擎的,當由不同的模板解析器時,負責將模板解析器裝載到引擎中。如下圖
ThymeleafDefaultConfiguration-->SpringTemplateEngine

這裡寫圖片描述

//以下的和我們關係不大,就不詳細介紹了
//配置方言的
ThymeleafConditionalCommentsDialectConfiguration-->ConditionalCommentsDialect
 //配置頁面佈局的
 ThymeleafWebLayoutConfiguration-->LayoutDialect
 //配置DataAttribute方言的
 DataAttributeDialectConfiguration-->DataAttributeDialect
 //配置SpringSecurity方言的
 ThymeleafSecurityDialectConfiguration-->SpringSecurityDialect
 //配置Java8方言的
 ThymeleafJava8TimeDialect-->Java8TimeDialect
 //用來配置拼接對映路徑並轉換編碼的
 ThymeleafResourceHandlingConfig

3:名稱空間

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

二:表示式

1:變量表達式:${}
選擇表示式:*{}
訊息表示式:#{}
URL表示式:@{}
片段表示式:~{}
2: 文字文字:’one text’,’Another one!’,…
號碼文字:0,34,3.0,12.3,…
布林文字:true,false
空文字: null
文字標記:one,sometext,main,…
3:文字操作:

字串連線: +
文字替換: |The name is ${name}|
4:算術運算:
二元運算子:+,-,*,/,%
減號(一元運算子): -
5:布林運算:
二元運營商:and,or
布林否定(一元運算子): !,not
6:比較和平等:
比較:>,<,>=,<=(gt,lt,ge,le)
平等運營商:==,!=(eq,ne)
7:有條件的操作符:
IF-THEN: (if) ? (then)
IF-THEN-ELSE: (if) ? (then) : (else)
預設: (value) ?: (defaultvalue)
8:特殊令牌:
無操作: _