SpringBoot集成前端模版(thymeleaf)
Posted cppdy
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了SpringBoot集成前端模版(thymeleaf)相关的知识,希望对你有一定的参考价值。
1、在application.properties配置文件中添加 thymeleaf 的配置信息
spring.datasource.driverClassName=com.mysql.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/test
spring.datasource.username=root
spring.datasource.password=root
spring.thymeleaf.mode=html5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
spring.thymeleaf.cache=false
2、在pom.xml中引入thymeleaf 的jar包
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
3、创建PageController并添加index方法
package com.cppdy.controller; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class PageController { @RequestMapping("index") public String index(Model model) { model.addAttribute("name","吹泡泡的魚"); return "index"; } }
4、在src/main/resources下创建templates(默认访问此文件下的html),并创建index.html
在src/main/resources下创建static(默认访问此文件夹下的静态文件),在static文件夹创建images文件夹,并放入一张图片
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <title>SpringBoot</title> </head> <body> Welcome to cppdy <p th:text="${name}"></p> <img alt="吹泡泡的魚" th:src="@{/images/logo.jpg}"/> <br/> <input th:value="${name}"/> </body> </html>
注:@表示当前项目路径,static文件夹是系统默认加载的静态文件路径
以上是关于SpringBoot集成前端模版(thymeleaf)的主要内容,如果未能解决你的问题,请参考以下文章
SpringBoot系列十一:SpringBoot整合Restful架构(使用 RestTemplate 模版实现 Rest 服务调用Swagger 集成动态修改日志级别)
SpringBoot入门篇--Thymeleaf引擎模板的基本使用方法