spring boot整合Thymeleaf简单运用与入坑水贴

1.1 Thymeleaf是什么

Thymeleaf是面向Web和独立环境的现代服务器端Java模板引擎,能够处理HTML,XML,JavaScript,CSS甚至纯文本。

1.2 Thymeleaf能处理哪些模版

开箱即用,Thymeleaf可让处理六种类型的模板,每种类型的模板称为模板模式:

  • HTMl
  • XML
  • TEXT
  • JAVASCRIPT
  • CSS
  • RAW

也不做太多介绍不会就去看看官方文档,这里我只用了HTML
HTML模板模式将允许任何类型的HTML输入,包括HTML5,HTML 4和XHTML。Thymeleaf在html5非验证模式和验证模式下都能正确执行,并且在输出结果中最大程度的遵循模板代码/结构。

1.3 HTML怎么应用Thymeleaf

创建一个maven项目导入springboot的子项目:

    <!-- springboot依赖 -->
  <parent>
  	<groupId>org.springframework.boot</groupId>
  	<artifactId>spring-boot-starter-parent</artifactId>
  	<version>1.5.10.RELEASE</version>
  </parent>

然后导入Thymeleaf和web依赖包:

  	<!-- Web模块:spring-boot-starter-web -->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-web</artifactId>
	</dependency>
	
	<!-- thymeleaf依赖 -->
  	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-thymeleaf</artifactId>
	</dependency>

关于使用springboot的thymeleaf模板时默认会对HTML进行严格的检查,导致当标签没有闭合时就会通不过。nekohtml这个依赖可以解决这一问题。

修改pom文件,添加依赖
<!-- nekohtml依赖 -->
<dependency>
   <groupId>nekohtml</groupId>
   <artifactId>nekohtml</artifactId>
   <version>1.9.6.2</version>
</dependency>
修改配置yml
spring:
   thymeleaf:
      cache: false #是否启用模板缓存  开发环境不用所以使用false 默认为true
      mode: LEGACYHTML5 #回避HTML进行严格的检查的配置,需要提前引入nekohtml依赖
      prefix: classpath:/public/  #在构建URL时添加前缀以查看名称的前缀  ,放网页的地方
server: 
  port: 8888 

---------------------------------------------------------------------------------- 万恶的分割线-----------------------------------------------------------------------------------

前面算入坑指南~~~~这些都是简单配置和上一篇连接起来的运用如下:

上一篇

模型:
在这里插入图片描述
pom依赖:

    <!--Maven默认依赖 -->
  <parent>
  	<groupId>org.springframework.boot</groupId>
  	<artifactId>spring-boot-starter-parent</artifactId>
  	<version>1.5.10.RELEASE</version>
  </parent>
  <dependencies>
  	<!-- Web依赖 -->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-web</artifactId>
	</dependency>
	<!-- solr依赖 -->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-data-solr</artifactId>
	</dependency>
	<!-- 小辣椒依赖 -->
	<dependency>
	    <groupId>org.projectlombok</groupId>
	    <artifactId>lombok</artifactId>
	    <scope>provided</scope>
	</dependency>
	<!-- thymeleaf依赖 -->
  	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-thymeleaf</artifactId>
	</dependency>
	<!-- 使用springboot的thymeleaf模板时默认会对HTML进行严格的检查,导致当你的标签没有闭合时就会通不过。nekohtml这个依赖可以解决这一问题。 -->
	<dependency>
	   <groupId>nekohtml</groupId>
	   <artifactId>nekohtml</artifactId>
	   <version>1.9.6.2</version>
	</dependency>
	
	<!-- 开发者工具集 -->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-devtools</artifactId>
		<optional>true</optional>
	</dependency>
	
  </dependencies>

控制层:

package cn.lp.controller;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import cn.lp.dao.PersonDao;
import cn.lp.entity.Person;
import cn.lp.entity.User;
/**
 * Model可直接传输数据,HttpServletRequest还需转接session会话控制接收
 * @author Administrator
 *
 */
@Controller
public class ThyController {
	@GetMapping("/getIndex")
	public String getIndex(Model model,HttpServletRequest request) {
		Map map=new HashMap();
		map.put("id", 1);
		map.put("name", "刘皇叔");
		model.addAttribute("user",map);
		
		User user=new User();
		user.setUserId("520");
		user.setUserName("跳跳糖");
		request.getSession().setAttribute("user1",user);
		return "index";
	}
	@Autowired
	private PersonDao pd;
	
	@GetMapping("/getposolr")
	public String findByDescx(String descx,Model model) {
		List<Person> personList = pd.findByDesc(descx);
		model.addAttribute("personList",personList);
		return "posolr";
	}	
}

数据访问层dao

package cn.lp.dao;

import java.util.List;

import org.springframework.data.solr.repository.SolrCrudRepository;

import cn.lp.entity.Person;

public interface PersonDao extends SolrCrudRepository<Person, String> {
	
	public List<Person> findByDesc(String keyword);

}

实体层entity 俩个一个是简单运用 一个是调用solr完成一个表格

package cn.lp.entity;

import org.apache.solr.client.solrj.beans.Field;
import org.springframework.data.solr.core.mapping.SolrDocument;

import lombok.Data;
/**
 * @Field指定core里的参数
 * @SolrDocument(solrCoreName="mycore")指定core(核)
 * @author Administrator
 *	我只把后缀为_ik的做了分词
 */
@Data
@SolrDocument(solrCoreName="mycore")
public class Person {
	
	private String id;
	
	@Field("country_ik")
	private String  country;
	@Field("name_ik")
	private String name;
	@Field("desc_ik")
	private String desc;
	@Field("provice_ik")
	private String provice;
	@Field("city_ik")
	private String city;
	
	@Field("age_i")
	private String age;
}

package cn.lp.entity;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.ToString;

@Data//get,set方法
@NoArgsConstructor//无参的构造方法
@AllArgsConstructor//带参的构造方法
@ToString//toString方法
public class User {
	private String  userId;
	
	private String userName;
	
	
}

main方法

package cn.lp;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class ThyMain {
	//thymeleaf是从控制层经过,扫描html页面是否有th:标签,含有的话就使用thymeleaf的方法并顶替里面原始的值
	public static void main(String[] args) {
		SpringApplication.run(ThyMain.class, args);		
	}
}

index.html页面 简单运用方法的页面

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	${sec}
	<input name="usesName" th:name="${sex}"/>
	
<!-- 	th:text会转译所以得出的值是一个字符串
	th:utext不转译,得出的值是一串html标签 -->
	<div th:text="'<button>天天路过</button>'">
		摇摇晃晃	
	</div>
	<div th:utext="'<button>天天路过</button>'">
		摇头晃脑
	</div>
	
	<!-- 可以从控制层中获取到参数使用会话属性  并且还可以运用java代码 -->
 	<div th:utext="name等于+${user.name}">
		摇摇欲坠
	</div>
	<div th:utext="id等于+${user.id}">
		英勇无畏
	</div>
	<div th:utext="user等于+${user}">
		无畏
	</div>
	<!-- 将获得的数据用变量接收,只在该div生效  -->
	<div th:object="${user}">
		user对象用*id:<p th:text="*{id}"></p>
		user对象用*name:<p th:text="*{name}"></p>
		"
	</div>
	用session调用:<div th:text="${session.user1.userId}"></div>
	用sesion调用属性的方法:<p th:text="${session.user1.toString()}"></p>
	三目运算法:	<td th:text="${session.user1.userId}==520 ? true : false">yes</td>
	
</body>
</html>

posolr.html 调用solr做出的表格页面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

</script>
</head>
<body>

	<!-- 使用模板 -->
	<div th:include="template :: copy"></div>
	<script>alert($)</script>

<form action="getposolr" method="get">
	<input id="keyword" type="text" name="descx">
	<input type="submit" value="提交"/>
</form>
	
	<table>
		<tr>
			<th>国家</th>
			<th>城市</th>
			<th>姓名</th>
			<th>描述</th>
			<th></th>
		</tr>
		<!-- 遍历 迭代器  循环   三目判断使用风格   -->
		<tr th:each="List,itf:${personList}" th:style="${itf.odd}?'background-color:red':'background-color:aqua'">
			<td th:text="${List.country}"></td>
			<td th:text="${List.provice}"></td>
			<td th:text="${List.name}"></td>
			<td th:text="${List.desc}"></td>
		</tr>		
	</table>
		
</body>
</html>

template.html 一个模板的页面

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 我是一个小模板  可以放js 类似于父项目 -->
	<div th:fragment="copy"> 1----2-----3-----4----5----6
		<script>alert('我使用了alert')</script>
		<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
	</div>
</body>
</html>

application.yml配置文件

spring:
   thymeleaf:
       #是否启用模板缓存  开发环境不用所以使用false 默认为true
      cache: false
       #回避HTML进行严格的检查的配置,需要提前引入nekohtml依赖
      mode: LEGACYHTML5
        #在构建URL时添加前缀以查看名称的前缀  ,放网页的地方
      prefix: classpath:/public/
      
   data: 
      solr: 
         host: http://192.168.146.133:8983/solr
server: 
  port: 8888  

执行效果:
调用solr的页面
在这里插入图片描述
简单运用页面:
在这里插入图片描述
没了 水完了

thymeleaf 必须要经过控制层才能有效 直接运行无效

猜你喜欢

转载自blog.csdn.net/weixin_43452866/article/details/84894438