Springboot 之 引入Thymeleaf
转自:https://segmentfault.com/a/1190000011149325
前言
Spring-boot-starter-web集成了Tomcat以及Spring MVC,会自动配置相关东西,Thymeleaf是用的比较广泛的模板引擎
1.引入依赖
<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>
2.在一个名为application.propertiesde 的文件中配置Thymeleaf
server.port=8080
spring.thymeleaf.cache=false
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.check-template-location=true
spring.thymeleaf.suffix=.html
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
spring.thymeleaf.mode=HTML5
3.文件结构
4.Controller
package com.dlp.Controller;
import com.dlp.model.Person;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.ArrayList;
import java.util.List;
/**
* Created by Administrator on 2017/9/6.
*/
@Controller
public class HelloController {
@RequestMapping(value = "/index")
public String index(Model model)
{
Person single = new Person("hyj",21);
List<Person> people = new ArrayList<Person>();
Person p1 = new Person("dlp",21);
Person p2 = new Person("tq",21);
Person p3 = new Person("mk",21);
people.add(p1);
people.add(p2);
people.add(p3);
model.addAttribute("singlePerson",single);
model.addAttribute("people",people);
return "index";
}
}
这里使用@Controller而不用@RESTController是因为这里返回一个页面而不是一个值,如果只是使用@RestController注解Controller,则Controller中的方法无法返回jsp页面,配置的视图解析器InternalResourceViewResolver不起作用,返回的内容就是Return 里的内容。
5.Model类
package com.dlp.model;
/**
* Created by Administrator on 2017/9/6.
*/
public class Person {
private String name;
private Integer age;
public Person() {
super();
}
public Person(String name,Integer gae) {
super();
this.name=name;
this.age=gae;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name=name;
}
public Integer getAge() {
return age;
}
public Integer setAge(Integer age) {
return age;
}
}
6.index页面
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" >
<head>
<meta content="text/html;charset=UTF-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link th:href="@{/bootstrap/css/bootstrap.min.css}" rel="stylesheet"/>
<link th:href="@{/bootstrap/css/bootstrap-theme.min.css}" rel="stylesheet"/>
</head>
<body>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">访问model</h3>
</div>
<div class="panel-body">
<span th:text="${singlePerson.name}"></span>
</div>
</div>
<div th:if="${not #lists.isEmpty(people)}">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">列表</h3>
</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item" th:each="person : ${people}">
<span th:text="${person.name}"></span>
<span th:text="${person.age}"></span>
<button class="btn" th:onlick="'getName(\''+${person.name}+'\');'">获得名字</button>
</li>
</ul>
</div>
</div>
</div>
<script th:src="@{/jquery/jquery-3.2.1.min.js}"></script>
<script th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
<script th:inline="javascript">
var single = [[${singlePerson}]];
console.log(single.name+"/"+single.age);
function getName(name) {
console.log(name);
}
</script>
</body>
</html>
xmlns:th="http://www.thymeleaf.org"命名空间,将镜头转化为动态的视图,需要进行动态处理的元素使用“th:”前缀;两个link引入bootstrap框架,通过@{}引入web静态资源(括号里面是资源路径)访问model中的数据通过${}访问,案例
7.运行
Springboot 之 引入Thymeleaf的更多相关文章
- springboot 引入 thymeleaf 模板
第一步pom中: <!-- 引入 thymeleaf 模板依赖 --> <dependency> <groupId>org.springframework.boot ...
- springboot引入thymeleaf
springboot引入thymeleaf 1.Thymeleaf使用 @ConfigurationProperties(prefix = "spring.thymeleaf") ...
- SpringBoot入门之Thymeleaf的使用
在.net的MVC3 或更高版本等支持 Razor 的框架里使用cshtml,Razor是一种简单的编程语法,用于在网页中嵌入服务器端代码.在使用springboot开发mvc时也有与.net类似的视 ...
- 8.SpringBoot 模板引擎 Thymeleaf
1.模板引擎原理 JSP.Velocity.Freemarker.Thymeleaf 都是模板引擎.SpringBoot推荐的Thymeleaf:语法更简单,功能更强大: Thymeleaf模板引擎 ...
- SpringBoot框架 之 Thymeleaf
目录 Thymeleaf 添加启动器 创建模板文件夹 基本使用 综合使用 Thymeleaf 介绍 SpringBoot并不推荐使用jsp Thymeleaf 是一个跟 Velocity.FreeMa ...
- SpringBoot 同时整合thymeleaf html、vue html和jsp
问题描述 SpringBoot如何同时访问html和jsp SpringBoot访问html页面可以,访问jsp页面报错 SpringBoot如何同时整合thymeleaf html.vue html ...
- 【SpringBoot】SpringBoot/MyBatis/MySql/thymeleaf/Log4j整合工程
工程下载地址:https://files.cnblogs.com/files/xiandedanteng/MMSpringWeb20191027-1.rar 工程目录结构如图: 1.创建工程 有些网文 ...
- 7 — 简单了解springboot中的thymeleaf
1.官网学习地址 https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html 2.什么是thymeleaf? 一张图看明白: 解读: ...
- Idea中SpringBoot引入thymeleaf没有提示
问题描述: 最近使用Idea搭建SpringBoot时,用到了 thymeleaf,但是出现了点问题:输入th: 代码有没有提示. 解决方法: <html lang="en" ...
随机推荐
- div 背景放图和直接放图区别
<html> <head> <meta charset="UTF-8"> <title></title> <sty ...
- for 循环 乘法口诀表
用for循环写乘法口诀表: for(var i = 1; i <= 9; i++) { var c=''; for(var x = 1; x <= i; x++) { c=c+x+' ...
- win2008系统日志不断出现【审核失败】
win2008系统日志不断出现[审核失败] [现象] 今天查看windows日志,在 -安全- 发现不断有消息刷出,显示 -审核失败- 事件ID为4624 的记录 每分钟大概刷新8条消息(如 ...
- dubbo之静态服务
有时候希望人工管理服务提供者的上线和下线,此时需将注册中心标识为非动态管理模式 <dubbo:registry address="10.20.141.150:9090" dy ...
- Percona Xtrabackup对数据库进行部分备份
Xtrabackup也可以实现部分备份,即只备份某个或某些指定的数据库或某数据库中的某个或某些表.但要使用此功能,必须启用innodb_file_per_table选项,即每张表保存为一个独立的文件. ...
- AI:恐怖谷理论的陷阱
科学人的小品:恐怖谷:娃娃为什么很可怕? 一.恐怖的来源 恐怖的来源:美学概念.思想对安全的认识,映射到美学领域,转化为美和丑.恐怖,是一种精心掩饰的丑陋. 二.桑尼与C3PO 桑尼更接近于人,为什么 ...
- linux系统下安装memcached
检查libevent 首先检查系统中是否安装了libevent rpm -qa|grep libevent 如果安装了则查看libevent的安装路径,后续安装时需要用到 rpm -ql libeve ...
- Ubuntu安装RTX2080显卡驱动
安装RTX2080显卡驱动 近日新购了一台DELL服务器,用于TensorFlow,由于显卡是另加的,需要安装显卡驱动. 服务器配置 服务器型号:DELL PowerEdge R730 CPU:2*I ...
- Idea 类注释和方法注释
类注释 先打开Settings > Editor > File and Code Templates Includes Includes File Header 再随机新建个类就有类注释 ...
- Linux—Ubuntu14.0.5安装mongo
1.安装mongo sudo apt-get install mongo 2.如果遇到找不到安装包运行,那就更新资源列表 sudo apt-get update 3.安装成功会自动运行mongo pg ...