thymeleaf的使用
### 原理
了解MVC
-
曾经编写过下面这段代码
这段代码虽然说可以实现在登录失败之后跳转回到登录页面,并且展示失败信息,但是代码实在是太恶心了,根本没法维护,所以我们需要将视图展示抽取出来,单独作为一个View视图层
1.代码比较乱无法维护
但是我们如果只使用HTML作为视图的话,它是无法展示动态数据的,所以我们对HTML的新的期待:既能够正常显示页面,又能在页面中包含动态数据部分。而动态数据单靠HTML本身是无法做到的,所以此时我们需要引入服务器端动态视图模板技术。
2.只使用HTML作为视图的话,它是无法展示动态数据的
MVC概念
M:Model模型
V:View视图
C:Controller控制器
MVC是在表述层开发中运用的一种设计理念。主张把封装数据的『模型』、显示用户界面的『视图』、协调调度的『控制器』分开。
逻辑视图
物理视图=视图前缀+逻辑视图+视图后缀
上面的例子中:
视图前缀 | 逻辑视图 | 视图后缀 | 物理视图 |
---|---|---|---|
/pages/user/ | login | .html | /pages/user/login.html |
/pages/user/ | login_success | .html | /pages/user/login_success.html |
使用步骤
-
加入jar包
-
配置上下文参数
<context-param>
<param-name>view-prefixparam-name>
<param-value>/WEB-INF/view/param-value>
context-param>
<context-param>
<param-name>view-suffixparam-name>
<param-value>.htmlparam-value>
context-param> -
创建Servlet基类
直接复制,以后框架后,这些代码会被取代
import org.thymeleaf.TemplateEngine;
import org.thymeleaf.context.WebContext;
import org.thymeleaf.templatemode.TemplateMode;
import org.thymeleaf.templateresolver.ServletContextTemplateResolver;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class ViewBaseServlet extends HttpServlet {
private TemplateEngine templateEngine;
@Override
public void init() throws ServletException {
// 1.获取ServletContext对象
ServletContext servletContext = this.getServletContext();
// 2.创建Thymeleaf解析器对象
ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver(servletContext);
// 3.给解析器对象设置参数
// ①HTML是默认模式,明确设置是为了代码更容易理解
templateResolver.setTemplateMode(TemplateMode.HTML);
// ②设置前缀
String viewPrefix = servletContext.getInitParameter("view-prefix");
templateResolver.setPrefix(viewPrefix);
// ③设置后缀
String viewSuffix = servletContext.getInitParameter("view-suffix");
templateResolver.setSuffix(viewSuffix);
// ④设置缓存过期时间(毫秒)
templateResolver.setCacheTTLMs(60000L);
// ⑤设置是否缓存
templateResolver.setCacheable(true);
// ⑥设置服务器端编码方式
templateResolver.setCharacterEncoding("utf-8");
// 4.创建模板引擎对象
templateEngine = new TemplateEngine();
// 5.给模板引擎对象设置模板解析器
templateEngine.setTemplateResolver(templateResolver);
}
protected void processTemplate(String templateName, HttpServletRequest req, HttpServletResponse resp) throws IOException {
// 1.设置响应体内容类型和字符集
resp.setContentType("text/html;charset=UTF-8");
// 2.创建WebContext对象
WebContext webContext = new WebContext(req, resp, getServletContext());
// 3.处理模板数据
templateEngine.process(templateName, webContext, resp.getWriter());
}
}在html标签中添加命名空间 xmlns:th="http://www.htymeleaf.org"
第二章 Thymeleaf的基本语法
-
th:text="标签体新值"
-
不经过服务器解析,直接用浏览器打开HTML文件,看到的是『标签体原始值』
-
经过服务器解析,Thymeleaf引擎根据th:text属性指定的『标签体新值』去替换『标签体原始值』
-
-
修改指定属性值
-
例子
<input type="text" name="username" th:value="文本框新值" value="文本框旧值" />
-
语法:任何HTML标签原有的属性,前面加上『th:』就都可以通过Thymeleaf来设定新值。
-
-
解析url地址
-
所以@{}的作用是为字符串附加『上下文路径』
- 作用很大
-
-
获取请求参数
-
${param.参数名}
-
<p th:text="${param.username}">这里替换为请求参数的值p>
-
-
内置对象
-
内置对象在Thymeleaf中可以直接使用
-
使用方法:在表达式中 #内置对象.方法
-
如果不清楚这个对象有哪些方法可以使用,那么就通过getClass().getName()获取全类名,再回到Java环境查看这个对象有哪些方法
-
内置对象的方法可以直接调用
-
调用方法时需要传参的也可以直接传入参数
-
-
Object-Graph Navigation Language
-
概念:从根对象触发,通过特定的语法,逐层访问对象的各种属性。
-
在Thymeleaf环境下,${}中的表达式可以从下列元素开始:
-
访问属性域的起点
-
请求域的属性名
-
session
-
application
-
-
param
-
内置对象
-
request
-
session
-
lists
-
strings
-
-
-
属性访问语法
-
访问对象属性 对象.属性名
-
访问list集合或者数组 集合或数组[下标]
-
访问Map集合
-
Map集合['key']
-
Map集合.key
-
-
-
分支与迭代
-
if和unless 根据条件决定对象是否显示
-
例子:th:if="${book.isUsed}"
-
例子:th:unless="${book.isUsed}"
-
-
-
switch
<h3>测试switchh3>
<div th:switch="${user.memberLevel}">
<p th:case="level-1">银牌会员p>
<p th:case="level-2">金牌会员p>
<p th:case="level-3">白金会员p>
<p th:case="level-4">钻石会员p>
div> -
迭代
-
用法:使用th:each遍历 用法:
-
th:each写在什么标签上? 每次遍历出来一条数据就要添加一个什么标签,那么th:each就写在这个标签上
-
th:each的语法 th:each="遍历出来的数据,数据的状态 : 要遍历的数据"
-
status表示遍历的状态,它包含如下属性: index 遍历出来的每一个元素的下标 count 遍历出来的每一个元素的计数
-
-
例子 :
<table>
<tbody
<td th:text="${status.count}">这里显示编号td>
<td th:text="${teacher.teacherName}">这里显示老师的名字td>
tr>
tbody>
table> -
-
-