官网关于thymeleaf的介绍已经很详细了!总结起来就一句话:thymeleaf使得同一个页面模板对前端和后端都很友好(双赢),对于前端来说它就是一个静态页面,对于后端来说它便是动态页面!
thymeleaf是怎么做到这一点的呢? 其实thmeleaf提供了一堆侵入性很小的标签给后端人员使用,这些标签的插入位置全部都作为html标签的属性存在。对于浏览器来说这些非HTML标准属性在渲染的时候会被浏览器自动忽略,因此对于前端人员来说它就是一个静态页面;而后端通过thymeleaf引擎渲染的时候这些标签就会被识别,因此对于后端人员来说它又是动态页面!
下面通过一个简单的例子介绍如何在Spring Boot项目中使用thymeleaf。
thymeleaf的配置
1、在pom.xml文件中添加依赖:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
其中,spring-boot-starter-web用于支持web开发,spring-boot-starter-thymeleaf用于支持thymeleaf模板引擎。
2、配置属性
其实完全可以直接使用,不用配置。但是Spring Boot官方文档建议在开发时将缓存关闭,那就在application.properties文件中加入下面这行就行了:
spring.thymeleaf.cache=false
一个简单的例子
1、编写User类
package com.tao.springboot.domain;
public class User {
private String name;
private int age;
public User(String name, int age) {
super();
this.name = name;
this.age = age;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
2、编写Controller类
package com.tao.springboot.web.controller;
import java.util.ArrayList;
import java.util.List;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import com.tao.springboot.domain.User;
@Controller
@RequestMapping("/user")
public class UserController {
@RequestMapping(value = "/list", method = RequestMethod.GET)
public String userList(Model model) throws Exception {
model.addAttribute("title", "用户列表");
model.addAttribute("hello","Hello, Spring Boot!");
List<User> userList = new ArrayList<>();
userList.add(new User("小明", 25));
userList.add(new User("小黄", 23));
model.addAttribute("userList", userList);
return "/user/list";
}
}
3、创建thymeleaf模板文件
thymeleaf在Spring Boot中默认的模板配置路径为:src/main/resources/templates,因此我们在resources文件夹下面创建一个templates文件夹,然后创建/user/list.html文件:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title th:text="${title}">标题</title>
</head>
<body>
<h1 th:text="${hello}">hello</h1>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr th:each="user : ${userList}">
<td th:text="${user.name}">小明</td>
<td th:text="${user.age}">20</td>
</tr>
</table>
<select>
<option th:each="user : ${userList}" th:value="${user.name}" th:text="${user.name}">我是默认值</option>
</select>
</body>
</html>
4、启动程序
在浏览器中输入http://localhost:8080/user/list,访问成功: