SpringMVC 中的视图如何使用 Thymeleaf

简介: SpringMVC 中的视图如何使用 Thymeleaf

SpringMVC 中的视图如何使用 Thymeleaf


SpringMVC 是一个基于 Java 的 Web 框架,它是 Spring 框架的一部分,提供了一系列的组件和工具,帮助开发人员构建 Web 应用程序。其中,视图是 Spring MVC 中的核心组件之一,它负责将模型数据渲染成 HTML 页面并返回给客户端。Thymeleaf 是一种流行的模板引擎,它可以方便地将模型数据渲染成 HTML 页面。本文将介绍 SpringMVC 中的视图如何使用 Thymeleaf,并提供示例代码。


image.png


Thymeleaf 简介


Thymeleaf 是一个流行的模板引擎,它可以方便地将模型数据渲染成 HTML 页面。Thymeleaf 的模板语法与 HTML 语法非常相似,可以直接在 HTML 页面中嵌入 Thymeleaf 表达式。Thymeleaf 还提供了一系列的标准标签和属性,可以对 HTML 页面进行动态渲染。


下面是一个简单的 Thymeleaf 表达式示例:


<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf Example</title>
</head>
<body>
    <h1 th:text="${message}">Hello, World!</h1>
</body>
</html>

在上面的代码中,我们使用了 Thymeleaf 的 th:text 属性来渲染模型数据。这个属性会将 ${message} 表达式替换为模型中的 message 变量。


Thymeleaf 集成到 SpringMVC 中


Thymeleaf 可以与 SpringMVC 集成,用于渲染视图。下面我们来看一下如何将 Thymeleaf 集成到 SpringMVC 中。


步骤一:添加 Thymeleaf 依赖

在 pom.xml 文件中添加 Thymeleaf 的依赖:

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

骤二:配置 Thymeleaf 模板解析器

在 SpringMVC 的配置文件中,配置 Thymeleaf 模板解析器:


@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {
    @Bean
    public ITemplateResolver templateResolver() {
        SpringResourceTemplateResolver resolver = new SpringResourceTemplateResolver();
        resolver.setPrefix("/WEB-INF/views/");
        resolver.setSuffix(".html");
        resolver.setTemplateMode(TemplateMode.HTML);
        resolver.setCharacterEncoding("UTF-8");
        return resolver;
    }
    @Bean
    public SpringTemplateEngine templateEngine() {
        SpringTemplateEngine engine = new SpringTemplateEngine();
        engine.setTemplateResolver(templateResolver());
        return engine;
    }
    @Bean
    public ViewResolver viewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine());
        resolver.setCharacterEncoding("UTF-8");
        return resolver;
    }
}

在上面的代码中,我们创建了一个 SpringResourceTemplateResolver 对象,指定了 Thymeleaf 模板文件的位置和后缀名。然后,我们创建了一个 SpringTemplateEngine 对象,并将模板解析器设置为其属性。最后,我们创建了一个 ThymeleafViewResolver 对象,并将模板引擎设置为其属性。


步骤三:使用 Thymeleaf 视图

在控制器中,我们可以使用 Thymeleaf 视图来渲染模型数据。例如:

@Controller
public class HelloWorldController {
    @GetMapping("/hello")
    public String helloWorld(Model model) {
        model.addAttribute("message", "Hello, World!");
        return "hello";
    }
}

在上面的代码中,我们使用了 Model 对象来添加模型数据,并将 Thymeleaf 视图名称设置为 “hello”。Thymeleaf 视图名称的格式为 “文件名:后缀”,其中文件名是在 Thymeleaf 模板文件夹中的相对路径,后缀是 Thymeleaf 模板文件的后缀名。


步骤四:创建 Thymeleaf 模板文件

最后,我们需要在 Thymeleaf 模板文件夹中创建一个对应的模板文件。例如,在上面的示例中,我们需要在 “/WEB-INF/views/” 目录下创建一个名为 “hello.html” 的文件,文件内容如下:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf Example</title>
</head>
<body>
    <h1 th:text="${message}">Hello, World!</h1>
</body>
</html>

在上面的代码中,我们使用了 Thymeleaf 的 th:text 属性来渲染模型数据。这个属性会将 ${message} 表达式替换为模型中的 message 变量。


完整示例代码


下面是一个完整的使用 Thymeleaf 的 SpringMVC 示例代码:


WebConfig.java


@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {
    @Bean
    public ITemplateResolver templateResolver() {
        SpringResourceTemplateResolver resolver = new SpringResourceTemplateResolver();
        resolver.setPrefix("/WEB-INF/views/");
        resolver.setSuffix(".html");
        resolver.setTemplateMode(TemplateMode.HTML);
        resolver.setCharacterEncoding("UTF-8");
        return resolver;
    }
    @Bean
    public SpringTemplateEngine templateEngine() {
        SpringTemplateEngine engine = new SpringTemplateEngine();
        engine.setTemplateResolver(templateResolver());
        return engine;
    }
    @Bean
    public ViewResolver viewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine());
        resolver.setCharacterEncoding("UTF-8");
        return resolver;
    }
}

HelloWorldController.java


@Controller
public class HelloWorldController {
    @GetMapping("/hello")
    public String helloWorld(Model model) {
        model.addAttribute("message", "Hello, World!");
        return "hello";
    }
}

hello.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf Example</title>
</head>
<body>
    <h1 th:text="${message}">Hello, World!</h1>
</body>
</html>

总结


本文介绍了如何在 SpringMVC 中使用 Thymeleaf 来渲染视图。我们首先简要介绍了 Thymeleaf 的基本语法和特点,然后详细介绍了如何将 Thymeleaf 集成到 SpringMVC 中,并提供了示例代码。使用 Thymeleaf 可以方便地将模型数据渲染成 HTML 页面,并且 Thymeleaf 的语法与 HTML 的语法非常相似,易于上手。


相关文章
|
9月前
|
Java
Springboot视图解析与模板引擎~
Springboot视图解析与模板引擎~
SpringMVC学习(七):SpringMVC的视图
SpringMVC学习(七):SpringMVC的视图
148 0
SpringMVC学习(七):SpringMVC的视图
SpringMVC 中的视图如何使用 Velocity
SpringMVC 中的视图如何使用 Velocity
|
前端开发 Java Spring
Spring MVC 中自定义视图 @Component 及 配置 多个视图解析器 Excel视图
首先我们建立一个自己的View实现View接口。要注意在类上面加上@Component的注解,因为看BeanNameViewResolver的源码知道,是直接从ioc容器里面拿的根据名字拿的视图,所以我们得把我们自己写的视图放到容器里面。 HelloView.java package com.hust.springmvc.views; import java.uti
2336 0
|
9月前
|
XML Java 数据库连接
MyBatis 解决上篇的参数绑定问题以及XML方式交互
MyBatis 解决上篇的参数绑定问题以及XML方式交互
91 0
|
前端开发 Java Spring
[Spring MVC] - JSP + Freemarker视图解释器整合(转)
Spring MVC中如果只使用JSP做视图,可以使用下面这段即可解决:   但很多时候我们需要的不只是JSP做view,可能会引用velocity、freemarker等做为view引擎时,需要加入额外的配置。
1084 0
|
前端开发 Java 容器
Spring Web MVC框架(四) 视图和视图解析
视图解析器 在Spring中视图相关的两个接口是ViewResolver和View两个接口,ViewResolver用于视图名称和实际视图之间的映射,View接口用于准备和传递数据到实际的视图。
966 0
|
前端开发 Java Spring
Spring 视图和视图解析器简介
什么是 Spring 视图和视图解析器? Spring MVC(Model View Controller)是 Spring 中一个重要的组成部分,而 Spring 视图和视图解析器则是 Spring MVC 中的组成部分。在介绍 Spring 视图和视图解析器前,我们先了解下在 Spring MVC 框架中,一个 Web 请求所需经历的六个阶段: 请求会首先被 Spr
2554 0
|
Java Maven
springboot项目--freemarker使用ftl模板文件动态生成图片
springboot项目--freemarker使用ftl模板文件动态生成图片
904 0
|
9月前
|
XML 前端开发 Java
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
228 0

热门文章

最新文章