Webjas
以jar包形式引入前端框架，包括npm,jquery,bootstrap…
官网
pom导入
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.3.1-1</version>
</dependency>
资源路径
-
/ -
classpath:/static/ -
classpath:/public -
classpath:resource -
classpath:/META-INF/resource
类路径
classpath:java或resource都属于类路径
图标配置
**/favacon.ico:放在静态路径下，自动查找并配置，spring.mvc.favicon.enable配置启用，默认true开启
静态文件夹指定
spring.resources.static-location指定静态文件夹
spring.resources.static-location=classpath:godme,classpath:judas/resource
# 1. 此配置可以配置多个，用逗号进行分隔
# 2. 关键标记如classpath每个文件夹独享
thymeleaf
配置引入
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
默认版本2.1.1， 需要进行xml配置来进行新版本替换
新版本Spring-Boot似乎好了的样子，不过还是可以按照如下方法进行版本修正
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<java.version>1.8</java.version>
<!-- 上面会有其他配置，不用太在意，加上下面的配置就行了，根据自己的需求和环境看着办-->
<thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
<!-- 当使用新版本时注意layout版本， thymeleaf3需要layout2及以上版本支持-->
<thymeleaf-layout-dialect.version>2.0.5</thymeleaf-layout-dialect.version>
</properties>
具体版本可以通过查看pom知道：
spring-boot-starter-parentspring-boot-dependenciesthymeleaf.version
前面两个需要点击进去，最后一个是标签名，在第二层dependencies搜索即可
资源路径
@ConfigurationProperties(prefix = "spring.thymeleaf")
public class ThymeleafProperties {
private static final Charset DEFAULT_ENCODING = StandardCharsets.UTF_8;
public static final String DEFAULT_PREFIX = "classpath:/templates/";
public static final String DEFAULT_SUFFIX = ".html";
自动配置的资源前缀为classpath:/templates/,后缀为.html
如果需要调整，可以通过外部进行配置覆盖
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix='.html'
全部的可配置项，就是spring自动项目下的各种默认配置
未配置时采用的是spring的默认配置项，当外部进行配置的时候对默认配置进行覆盖
资源访问
@Controller
public class MyController {
@RequestMapping("/hello")
public String hello(){
return "hello";
}
}
当直接返回字符串的时候，实际返回的是prefix+return+suffix。
然后系统根据路径自动路由到指定的模板文件。
注意：
@Controller而不是@RestController或许开发接口时常用
@RestController,因为集成了@Controller和ResponseBody,比较方便。但是或许会让人忽略
@ResponseBody的含义：响应内容如果是
@RestController,thymeleaf就不能够帮你路由了，只会把return直接输出页面了。切记切记
模板定义
1. 名称空间
<html lang="en" xmlns:th="http://www.thymeleaf.org">
2. 特殊标签
<h1 th:text="${fuck}">yes</h1>
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 th:text="${name}">yes</h1>
</body>
</html>
数据传递
@Controller
public class MyController {
@RequestMapping("/hello")
public String hello(Map<String, Object> map){
map.put("name","godme");
return "hello";
}
}
通过参数注入Map,然后往里面塞东西就行了，Spring会自动把数据传达到模板里面。
<h1 th:text="${fuck}">yes</h1>
模板里面取的数值，就是从传入的数据里面取出来的。
标签属性
1. 替换
<h1 text="default" th:text="${new}">old</h1>
newdefaultold
页面按照如上的显示优先级进行显示，优先级高的会对优先级低的进行覆盖。
当th:text没有取出任何值，就会向下查询，所以放心使用，不会乱抛异常的。
2. 范围
| html | thymeleaf |
|---|---|
id |
th:id |
class |
th:class |
href |
th:href |
text |
th:text |
| … | th:… |
每一种标签属性都有对应替换，大胆使用，都覆盖全了。
表达式
${}
# 取值
${person}
# 级联属性
${person.info.age}
# 级联属性
${person['info']['age']}
# map
${students['godme'].name}
# list
${students[0].name}
# 方法调用
${person.getName()}
# 方法传参
${person.setName('param').}
# 内部#使用内置基本对象
${#locate.country}
# 工具对象
${#string.toString(obj)}
${#string.startWith(obj, 'start')}
*{}
<!--同${}, 可以使用${}全部功能，额外提供以其他功能-->
<tr th:object="${user}">
<!-- 指代(存储)前面取出对象， 相当于 ${user.name}, 可以直接取出属性-->
<td>name:<span th:text="*{name}"></span></td>
<td>age :<span th:text="*{age}"> </span></td>
<td>male:<span th:text="*{male}"></span></td>
</tr>
- #{}
- 取国际化信息
- @{}
<!-- 常用于连接设置 -->
<!-- 完整链接-->
<a th:href="http://127.0.0.1:8080/student/search?username=godme$userage=18"></a>
<!-- 可直接替换-->
<a th:href="@{http://127.0.0.1:8080/student/search?username=godme$userage=18}"></a>
<!-- 省略，默认访问本机服务-->
<a th:href="@{/student/search?username=godme$userage=18}"></a>
<!-- 1. 可直接传参 2. 其中可用${} 3. 自动拼接参数-->
<a th:href="@{/student/search(username=${user.name}, userage=${user.age})"></a>
- ~{}
- 插入片段文档
这个不太明白，看
thymeleaf官方文档吧
特殊标签
th:utext
th:text设置设置信息，不会经过转义
th:utext功能同上，但是会对特殊字符进行转义
<!--行内写法-->
<!-- 每次text都得写属性比较麻烦，可以采用行内写法 -->
<span th:text="${user.name}"></span>
<span>[[user.name]]</span>
<!-- 两种行内写法是否转义对照写法 -->
<span th:utext="${user.name}"></span>
<span>[(user.name)]</span>
th-each
<!-- 遍历 -->
<tr th:each="student:${students}">
<td>name: <span th:text="${student.name}"></span></td>
<td>male: <span th:text="${student.male}"></span></td>
<!-- 三目运算 和#{} 内置对象 -->
<td>young: <span th:text="${student.isYoung}?#{true}:#{false}"></span></td>
</tr>
<!-- 单标签遍历-->
<h1 th:text="${student.name}" th:each="student:${students}"></h1><!--会生成多个h1标签-->
<h1 th:each="student : ${students}">[[student.name]]</h1><!-- 行内写法多个信息拼接，标签只有一个-->