thymeleaf是一种服务端的Java模板引擎,可以对html页面进行渲染,用于动态展示数据
1、SpringBoot集成thymeleaf
SpringBoot对thymeleaf提供了比较完整的支持
1.1 添加依赖
添加依赖可以在创建SpringBoot项目时进行,也可以在创建项目后进行
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
1.2 application.yml配置
server:
port: 8081
spring:
datasource:
username: root
type: com.alibaba.druid.pool.DruidDataSource
password: huwenlong
driver-class-name: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://localhost:3306/mydb?useSSL=TRUE&serverTimeZone=UTC&characterEncoding=UTF-8
thymeleaf:
cache: false
mode: LEGACYHTML5
encoding: UTF-8
mybatis:
mapper-locations: classpath:com/qianfeng/dao/*.xml
type-aliases-package: com.qianfeng.pojo
cache:false设置不使用缓存,mode设置使用不严格的HTML标准,encoding设置编码。不需要进行前缀与后缀的配置,因为默认的html文件在templates目录下,默认的后缀是.html。
1.3 html配置
在html文件中添加以下xml命名空间
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
1.4 详细页面
users.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>全部用户</title>
</head>
<body>
<h3>this is users page</h3>
<a href="#" th:href="@{/add.html}">添加</a>
<table>
<tr>
<th>用户id</th>
<th>用户名</th>
<th>年龄</th>
<th>性别</th>
<th>地址</th>
<th>操作</th>
</tr>
<tr th:each="u:${users}">
<td th:text="${u.id}">1</td>
<td th:text="${u.name}">张三</td>
<td th:text="${u.age}">20</td>
<td th:text="${u.sex}==1?'男':'女'">女</td>
<td th:text="${u.address}">北京市朝阳区</td>
<td>
<a href="#" th:href="'/deleteUser/'+${u.id}">删除</a>
<a href="#" th:href="'/getUserInfo/'+${u.id}">修改</a>
</td>
</tr>
</table>
</body>
</html>
所有的thymeleaf指令都以th:开头。th:each用于遍历,th:text用于填充文本,th:href用于指定a标签的href属性,@{}用于展示url,${}用于获取对象的值。
user.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>用户详情</title>
</head>
<body>
<form method="post" action="/updateUser" th:object="${user}">
用户id:<input type="text" name="id" readonly value="1" th:value="*{id}"><br>
用户名:<input type="text" name="name" value="张三" th:value="*{name}"><br>
密码:<input type="password" name="password" value="123456" th:value="*{password}"><br>
年龄:<input type="number" name="age" value="20" th:value="*{age}"><br>
性别:<input type="radio" name="sex" value="1" th:field="*{sex}">男
<input type="radio" name="sex" value="2" th:field="*{sex}">女 <br>
地址:<input type="text" name="address" value="北京市" th:value="*{address}"> <br>
<input type="submit" value="提交">
</form>
</body>
</html>
th:object指定了一个自定义的对象,*{}用户获取自定义对象的属性,th:field用于单选与多选回显。
2、SpringMVC集成thymeleaf
相较于SpringBoot,SpringMVC集成thymeleaf稍显麻烦:
2.1 添加依赖
<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf-spring4</artifactId>
<version>3.0.9.RELEASE</version>
</dependency>
2.2 配置spring-mvc.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd">
<bean id="templateResolver" class="org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver">
<property name="prefix" value="/"/>
<property name="suffix" value=".html"/>
<property name="templateMode" value="HTML"/>
</bean>
<bean id="templateEngine" class="org.thymeleaf.spring4.SpringTemplateEngine">
<property name="templateResolver" ref="templateResolver"/>
</bean>
<bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
<property name="templateEngine" ref="templateEngine"/>
<property name="characterEncoding" value="UTF-8"/>
<property name="contentType" value="text/html;charset=UTF-8"/>
</bean>
<context:component-scan base-package="com.qianfeng.controller"/>
<mvc:annotation-driven/>
<!--配置拦截器-->
<mvc:default-servlet-handler/>
<import resource="classpath:spring-mybatis.xml"/>
</beans>
这里配置了三个bean,一个是模板解析器,一个是模板引擎,还是有一个是视图解析器,这三个bean是层层依赖的。
网友评论