前言:突然发现自己给自己埋了一个大坑,毕设好难..每一个小点拎出来都能当一个小题目(手动摆手..),没办法自己选的含着泪也要把坑填完..先一点一点把需要补充的知识学完吧..
Thymeleaf介绍
稍微摘一摘【官网】上面的介绍吧(翻译是找到,有些增加的内容):
- 1.Thymeleaf is a modern server-side Java template engine for both web and standalone environments.Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎,能够处理HTML,XML,JavaScript,CSS甚⾄纯⽂本。
- 2.Thymeleaf's main goal is to bring elegant natural templates to your development workflow — HTML that can be correctly displayed in browsers and also work as static prototypes, allowing for stronger collaboration in development teams.Thymeleaf旨在提供⼀个优雅的、⾼度可维护的创建模板的⽅式。 为了实现这⼀⽬标,Thymeleaf建⽴在⾃然模板的概念上,将其逻辑注⼊到模板⽂件中,不会影响模板设计原型。 这改善了设计的沟通,弥合了设计和开发团队之间的差距。
- 3.With modules for Spring Framework, a host of integrations with your favourite tools, and the ability to plug in your own functionality, Thymeleaf is ideal for modern-day HTML5 JVM web development — although there is much more it can do.
对于Spring框架模块,一个允许你集成你最喜欢的工具的平台,并且能够插入自己的功能,Thymeleaf是理想的现代JVM HTML5 web开发工具,虽然它可以做得多。
然后官网还给出了一段看起来仍然像HTML一样工作的集成了Thymeleaf模版的代码,我们大致的来感受一下:
简单说, Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎,它可以完全替代 JSP。
Thymeleaf与JSP的区别在于,不运行项目之前,Thymeleaf也是纯HTML(不需要服务端的支持)而JSP需要进行一定的转换,这样就方便前端人员进行独立的设计、调试。相较与其他的模板引擎,它有如下三个极吸引人的特点:
- 1.Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板+数据的展示方式。浏览器解释 html 时会忽略未定义的标签属性,所以 thymeleaf 的模板可以静态地运行;当有数据返回到页面时,Thymeleaf 标签会动态地替换掉静态内容,使页面动态显示。
- 2.Thymeleaf 开箱即用的特性。它提供标准和spring标准两种方言,可以直接套用模板实现JSTL、 OGNL表达式效果,避免每天套模板、该jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
- 3.Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块,可以快速的实现表单绑定、属性编辑器、国际化等功能。
摘自:spring boot(四):thymeleaf使用详解-纯洁的微笑
00#先把需要环境搭起来
也就是SpringBoot项目的搭建,很常规,快速搭起来:
稍微改改包名还有描述,点击【Next】:
勾选上Web/Thymeleaf支持,然后点击【Next】:
选择项目保存位置,点击【Finish】:
至此就简单创建了一个用于学习Thymeleaf的简单环境。
01#创建一个Hello Thymeleaf页面
第一步:新建一个HelloController
在【com.wmyskxz.demo】下新建一个【controller】包,然后新建一个【HelloController】:
package com.wmyskxz.demo.controoler;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class HelloController {
@RequestMapping("/hello")
public String hello(Model model) {
model.addAttribute("name", "thymeleaf");
return "hello";
}
}
第二步:新建一个hello.html页面
在【resources】下的【templates】下新建一个【hello.html】文件,使用这个目录的原因是当你使用模板引擎时Spring Boot会默认在src/main/resources/templates
下去找,当然你也可以修改这个默认路径,这里就不做演示了:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Thymeleaf快速入门-Hello Thymeleaf</title>
</head>
<body>
<p th:text="${name}">name</p>
<p th:text="'Hello! ' + ${name} + '!'">hello world</p>
<p th:text="|Hello! ${name}!|">hello world</p>
</body>
</html>
第三步:把项目跑起来
事实上,上面已经展示了三种拼接字符串的方式,你应该也能看出thymeleaf的一点端倪,不过你第一件注意到的事应该是这是一个HTML5文件,可以由任何浏览器正确的显示,因为它不包含任何非HTML得标签(浏览器会忽略他们不明白的所有属性,如:th:text
)
项目运行之后,我们在地址栏输入localhost:8080/hello
,就会看到意料之中结果正确的页面:
但是你也可能会注意到,这个模板并不是一个真正有效的HTML5文档,因为HTML5规范不允许在th:*形式中使用这些非标准属性。事实上,我们甚至在我们的<html>
标签中添加了一个xmlns:th
属性,这绝对是非HTML5标准:<html xmlns:th="http://www.thymeleaf.org">
不管怎样,你已经看到了我们将如何使用Thymeleaf模板引擎访问model中的数据:“${}”,这和JSP极为相似,下面我们将进一步展示Thymeleaf的用法。
第四步:对项目做一些修改以方便调试
现在我们基础的环境和第一个任务(一个Hello World)页面都已经开发完成了,但是有一点不好的是,每一次我们对页面的修改都不能得到及时的反应,我们需要不断的重启服务器以看到效果,这在实际开发过程中是十分糟糕的表现,我们需要做一些修改,让Thymeleaf页面能够实时的刷新而不需要重启服务器。