java 模板引擎_畅游Spring Boot系列 — SpingBoot Thymeleaf模板引擎

cb03270bcec9ac7339dd2f8a593bf40a.png

一.模板引擎的基本概念

首先,Thymeleaf模板引擎是什么,简单来说,我们的Web工程肯定要生成动态的页面,之前我们使用JSP,要在页面上显示后台数据的时候使用<% %>或者JSTL调用后台数据,也就是后台直接生成HTML页面+数据的页面,直接传送到前台显示,JSP就是我们接触到的一个模板引擎.

总而言之一句话:模板引擎在服务器端将模板和数据合成,返回最终的html页面,常见的模板引擎有freemarker、velocity、thymeleaf等

c30fdb8420c58b344e88bfa9ae9685bc.png

对于SpringBoot来说官方建议的模板引擎是Thymeleaf,其实和我们喜闻乐见的JSP相比,就是把<%%>换成了Thymeleaf的标记而已.

二.SpringBoot中Thymeleaf的默认配置

我们先来看一下以前我们在Spring MVC的Controller中最常见的一段代码

@RequestMapping(value="/v", method=RequestMethod.GET)public String success() {    return "success";
}

这段代码的意思,相信熟悉Spring MVC的你,都应该知道,无非就是页面输入/v,Spring MVC的视图解析器就会找到返回值success,这里的返回值其实就应该是我们已经在Spring MVC配置文件中配置好的哪个文件夹下的以success开头,并且以相关后缀结束的文件,比如: xxx/xxx/success.html

所以针对于SpringBoot,这些东西肯定是已经配置好了的,不过一定要记住,我们的SpringBoot是约定大于配置的.首先,SpringBoot支持的后台模板引擎不再是JSP,而是Thymeleaf其次,Thymeleaf的相关配置也已经是约定好了的

org.springframework.boot.autoconfigure.thymeleaf.ThymeleafProperties
在这个类中有很关键的两句配置代码

public static final String DEFAULT_PREFIX = "classpath:/templates/";public static final String DEFAULT_SUFFIX = ".html";

默认所有的模板文件,都应该放在类资源下的templates文件夹默认所有的模板文件,都应该以.html后缀结尾

三.Thymeleaf的使用

当然,我们现在如果只是在Controller中这么写是没有任何作用的,我们还需要按照约定做以下几步

  1. 配置pom.xml,加载thymeleaf的starter
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId></dependency>
  1. 在工程的resources资源文件夹下创建templates文件夹,所有的模板文件都应该放在这个文件夹下面
  2. 创建.html模板文件,其实和一般的html没区别,但是最好在html文件开头添加上Thymeleaf的名称空间,不导入其实也没影响,不过在写页面的时候,就没有提示了
<html lang="en" xmlns:th="http://www.thymeleaf.org">

现在工程的结构,基本上是这个样子:

b96a25e8a0032d651029cfca9d655053.png

现在的HTML页面也很简单,除了添加的一句代码,和一般的HTML页面任何区别

我们写一段简单代码来测试一下,首先修改HelloController.java文件HelloController.java

@Controllerpublic class HelloController {    @RequestMapping(value="/v", method=RequestMethod.GET)    public String success(Model model) {
        model.addAttribute("username", "SpringBoot");        return "success";
    }
}

在HelloController的代码中,我添加了Model对象参数,往页面传值username,接下来,我们在success.html页面,使用Thymeleaf的语法来接收参数success.html

<!DOCTYPE html><html lang="en" xmlns:th="http://www.thymeleaf.org"><head><meta charset="UTF-8" /><title>Insert title here</title></head><body><h1>成功!</h1>你好:<span th:text="${username}"></span></body></html>

页面显示:

3bf0a4205fc1ca7dfd6086b59ef1edb8.png

正确得到了Controller中传递的值,这里使用Thymeleaf的语法th:text="${xxx}"

四.Thymeleaf 3

按照我的例子走下去,如果稍微不留意,估计你的页面就会报错,错误页面大概是这个样子

046b01233aba43705f213b98b7a8c119.png

意思是success页面第6行有错误,success页面不是我们的模板页面吗?而且第6行我们也没有写什么东西啊,为啥会报错?

注意,这其实是thymeleaf自身的问题,在thymeleaf 2.x版本,要求HTML中元素标签必须要闭合,但是在3.x版本中已经不存在该问题了

所以,我们只需要将thymeleaf的版本改为3.x就可以了.

怎么改,在官方文档中有详细的说明,在我们pom.xml文件的properties属性中,加入下面的代码就可以了

<properties>
    <thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
    <thymeleaf-layout-dialect.version>2.1.1</thymeleaf-layout-dialect.version></properties>

这里的thymeleaf.version就是thymeleaf的版本号,当然现在thymeleaf的版本可能已经不止3.0.2了,我们可以到GitHub上查看thymeleaf的最新版本

thymeleaf-layout-dialect其实是thymeleaf的布局管理器,他和thymeleaf.version相对于,所以,我们同样可以再GitHub上找到thymeleaf-layout-dialect最新版本

最终,我们先阶段能够用到最新的thymeleaf 3的版本,可以写成下面这个样子:

<properties>
    <thymeleaf.version>thymeleaf-3.0.11.RELEASE</thymeleaf.version>
    <thymeleaf-layout-dialect.version>2.3.0</thymeleaf-layout-dialect.version></properties>

关于Thymeleaf的相关语法,这里就不再做一一介绍了,我们后面通过案例,大家照着做一下,慢慢就熟悉了,这些东西也不需要专门去学习,这里列举Thymeleaf语法常用的表达式

五.Thymeleaf基本语法

1.属性优先权 th:*

简单来说,这个其实就和JSTL<c:when>、<c:choose>、<c:forEach>、<c:forTokens>、<c:if>、<c:set>…等等标签类似
具体相关内容如下表:

编号描述相关属性1片段包含th:insert th:replace2遍历th:each3条件判断th:if th:unless th:switch th:case4变量声明th:object th:with5属性修改th:attr th:attrprepend th:attrappend6修改HTML属性默认值 (在HTML属性前加上th,就能获取动态属性值)th:value th:hrefth:src …7标签体内容th:text th:utext8声明片段th:fragment9移除th:remove

2.表达式语法

其实和EL表达式是一个意思,只不过划分的更加详细

(一)简单表达式   
  1、变量的表达式:${...}
  2、选择变量表达式:*{...}
  3、信息表达式:#{...}
  4、链接URL表达式:@{...}
(二)字面值
  1、文本文字:'one text', 'Another one!',…
  2、文字数量:0, 34, 3.0, 12.3,…
  3、布尔型常量:true, false
  4、空的文字:null
  5、文字标记:one, sometext, main,…
(四)文本处理
  1、字符串并置:+
  2、文字替换:|The name is ${name}|
(五)表达式基本对象
  1、#ctx:上下文对象
  2、#vars:上下文变量
  3、#locale:上下文语言环境
  4、#httpServletRequest:(只有在Web上下文)HttpServletRequest对象
  5、#httpSession:(只有在Web上下文)HttpSession对象。
(六)实用工具对象 
  1、#dates: java.util的实用方法。对象:日期格式、组件提取等.
  2、#calendars:类似于#日期,但对于java.util。日历对象
  3、#numbers:格式化数字对象的实用方法。
  4、#strings:字符串对象的实用方法:包含startsWith,将/附加等。
  5、#objects:实用方法的对象。
  6、#bools:布尔评价的实用方法。
  7、#arrays:数组的实用方法。
  8、#lists:list集合。
  9、#sets:set集合。
  10、#maps:map集合。
  11、#aggregates:实用程序方法用于创建聚集在数组或集合.
  12、#messages:实用程序方法获取外部信息内部变量表达式,以同样的方式,因为它们将获得使用# {…}语法
  13、#ids:实用程序方法来处理可能重复的id属性(例如,由于迭代)。 

原文转自朗沃易课堂,更多精彩也可以搜索“朗沃”公众号了解更多IT行业精彩的内容奥!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值