Spring Boot 整合 Thymeleaf 视图层技术

Thymeleaf 的特点

Spring Boot中推荐使用Thymeleaf作为模板引擎.

因为Thymeleaf提供了完美的SpringMVC支持。

Thylemeleaf通过特定的语法对html的标记进行渲染。

SpringBoot整合Thymeleaf的步骤

2.1 创建spring boot项目

2.2. 打开pom.xml文件，查看启动器和jar坐标

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
    <groupId>org.projectlombok</groupId>
    <artifactId>lombok</artifactId>
    <optional>true</optional>
</dependency>

2.3. 编写用户实体类 （同上）

2.4. 编写获取用户信息控制器（同上）

/**

* 控制器返回一个代表跳转路径String的值，框架会自动在templates目录下，

* 找到与之对应html，由Thymeleaf进行渲染出来.

* 默认会认为跳转xxx.html页面，如果想要跳转到控制器,需要加上forward:或redirect:

@Controller
public class UsersController {
    @RequestMapping("/users")
    public String getUsers(Model model){
        List<User> list=new ArrayList<>();
        list.add(new User("1001","小张",18));
        list.add(new User("1002","小李",15));
        list.add(new User("1003","小王",17));
        list.add(new User("1004","小刘",16));
        model.addAttribute("list",list);

//跳转到thymeleaf的页面进行展示,设置前缀:classpath:/templates/ 后缀：.html

return "usersList";
}
}

2.5. 编写视图层Thymeleaf页面

Thymeleaf页面必须放在templates的目录下。在templates下创建usersList.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>用户信息展示页面</title>
</head>
<body>
<table width="480px" align="center" border="1" cellspacing="0" cellpadding="0">
    <tr>
        <th>用户编号</th>
        <th>姓名</th>
        <th>年龄</th>
    </tr>
    <tr th:each="user:${list}">
        <td th:text="${user.id}"></td>
        <td th:text="${user.name}"></td>
        <td th:text="${user.age}"></td>
    </tr>
</table>
</body>
</html>

2.6 打开application.properties配置文件，配置Thymeleaf

#thymeleaf配置
spring.thymeleaf.encoding=UTF-8
#配置模板的路径
spring.thymeleaf.prefix=classpath:/templates/
#配置模板的后缀
spring.thymeleaf.suffix=.html
#配置模板的模式,支持HTML,XML,JAVASCRIPT,TEXT
spring.thymeleaf.mode=HTML5

2.7 运行启动类，效果如下

Thymeleaf 语法详解

3.1 变量输出

th:text	设置标签的文本内容
th:value	设置input 标签的 value 属性值

案例演示

文本显示消息：<span th:text="${msg}"></span>
输入框显示消息：<input type="text" th:value="${msg}" />

3.2 内置对象

注意语法：

1.调用内置对象一定要用#

2.大部分的内置对象都以 s 结尾如：strings、numbers、dates、lists

3.2.1 strings 字符串对象

${#strings.isEmpty(msg)}	判断字符串是否为空，如果为空返回 true，否则返回 false
${#strings.contains(msg,'T')}	判断字符串是否包含指定的子串，如果包含返回 true，否则返回 false
${#strings.startsWith(msg,'a')}	判断当前字符串是否以子串开头，如果是返回 true，否则返回 false
${#strings.endsWith(msg,'a')}	判断当前字符串是否以子串结尾，如果是返回 true，否则返回 false
${#strings.length(msg)}	返回字符串的长度
${#strings.indexOf(msg,'h')}	查找子串的位置，并返回该子串的下标，如果没找到则返回-1
${#strings.substring(msg,13)}	截取子串
${#strings.toUpperCase(msg)}	字符串转大写
${#strings.toLowerCase(msg)}	字符串转小写

案例演示

msg是否为空：<span th:text="${#strings.isEmpty(msg)}"></span>
msg的长度：<span th:text="${#strings.length(msg)}"></span>
msg截取后的字符：<span th:text="${#strings.substring(msg,2)}"></span>

3.2.2日期格式化处理

${#dates.format(key)}	格式化日期，默认的以浏览器默认语言为格式化标准
${#dates.format(key,'yyyy/MM/dd')}	按照自定义的格式做日期转换
${#dates.year(key)}	获取日期中指定年份
${#dates.month(key)}	获取日期中指定月份
${#dates.day(key)}	获取日期中指定日

案例演示

显示日期：<span th:text="${time}"></span>
默认格式格式化日期：<span th:text="${#dates.format(time)}"></span>
指定格式格式化日期：<span th:text="${#dates.format(time,'yyyy-MM-dd')}"></span>
获取指定日期中的年份:<span th:text="${#dates.year(time)}"></span>

3.3 条件判断

3.3.1 th:if

3.3.2 th:switch

3.4 迭代遍历

3.4.1 th:each 迭代List集合

状态变量属性：

1. index:当前迭代器的索引从 0 开始

2. count:当前迭代对象的计数从 1 开始

3. size:被迭代对象的长度

4. even/odd:布尔值，当前循环是否是偶数/奇数从 0 开始

5. first:布尔值，当前循环的是否是第一条，如果是返回 true 否则返回 false

6. last:布尔值，当前循环的是否是最后一条，如果是则返回 true 否则返回 false

</tr>

3.4.2 th:each 迭代Map集合(省略,自己学习)

3.5. URL 表达式

3.5.1. Url相关的th指令

th:href th:src th:action

3.5.2. Url表达式语法

@{}

如：

3.5.3 在 url 中实现参数传递

1.方式一：通过url?key=value&key=value方式传参

2.方式二：通过restful风格方式传参

页面部分：

<a th:href="@{/{id}/{name}/getUser(id=1,name='xz')}">restful传值</a>

控制器部分：

@RequestMapping("/{id}/{name}/getUser")
public String getUsers(@PathVariable("id") String id,@PathVariable("name") String name){
    System.out.println("id:"+id);
    System.out.println("name:"+name);
    return "redirect:/users";
}

3.6 . 域对象操作

3.6.1 操作Request作用域

public String getUsers(Model model,HttpServletRequest request){

request.setAttribute("msg1","request作用域");

}

3.6.2 操作Session作用域

request.getSession().setAttribute("msg2","session作用域");

3.6.3 操作ServletContext作用域

request.getServletContext().setAttribute("msg3","application作用域");

Spring Boot 整合 Thymeleaf 视图层技术

猜你喜欢