SpringBoot4-Web2-模版引擎

发表于 分类于 ， ， 阅读次数： 本文字数： 3.4k 阅读时长 ≈ 3 分钟

模版引擎

常见的模版引擎有JSP,Velocity,Freemarker,Thymeleaf ### SpringBoot推荐的Thymeleaf 

1
2
3
4
5
<!--        模版引擎-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
视频中说这个版本有点低，是2.16的 然鹅我用的SpringBoot2，已经是3.x了 修改版本号,这招估计学了有用,这个能覆盖版本 
1
2
3
4
<properties>
  <thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
  <thymeleaf-layout-dialect.versoin>2.1.1</thymeleaf-layout-dialect.version>
</properties>
### Thymeleaf语法 还是去autoconfigure中找thymeleaf的ThymeleafAutoDConfigution,这里可以看到配置源码 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

/**
 * Properties for Thymeleaf.
 *
 * @author Stephane Nicoll
 * @author Brian Clozel
 * @author Daniel Fernández
 * @author Kazuki Shimizu
 * @since 1.2.0
 */
@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";
只要我们吧HTML页面放在class:/templates/下，thymeleaf就可以渲染。 继续修改我们的代码，注意这里不要用RestController注解， 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
package com.wsx.springboothelloworld.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

@Controller
public class HelloController {
    @RequestMapping("/hello")
    @ResponseBody // 把这个类的所以方法返回给浏览器，转化为json数据
    public String hello() {
        return "hello world quick!";
    }

    @RequestMapping("/templates_hello")
    public String templates_hello() {
        return "templates_hello";
    }
}
然后在templates下创建一个templates_hello.html这样就能返回那个html了

使用

thymeleafspring.pdf 在3.1中找到如下片段 导入名称空间 

1
2
3
4
5
6
7
8
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><title>Good Thymes Virtual Grocery</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" type="text/css" media="all" href="../../css/gtvg.css" th:href="@{/css/gtvg.css}"/>
</head>
<body><p th:text="#{home.welcome}">Welcome to our grocery store!</p></body>
</html>
修改我们的Controller 
1
2
3
4
5
@RequestMapping("/templates_hello")
public String templates_hello(Map<String,Object> map) {
    map.put("hello","map.put(hello,hello)");
    return "templates_hello";
}
我们这样写templates_hello.html,这里的text值得是改变当前div中的内容的 
1
2
3
4
5
6
7
8
9
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><title>Good Thymes Virtual Grocery</title>
</head>
<body>
    <h1>这个来自templates_hello.html</h1>
    <div th:text="${hello}"></div>
</body>
</html>
然后我们就得到了hello的内容 #### th th:text改变div文本，th:id改变id，th:class改变class，th可以改变所有的属性，更多的信息查看官方文档10 Attribute Precedence ##### Fragment inclusion 片段包含，如jsp的include，有th:insert和th:replace ##### Fragment iterator 遍历，如jsp的forEach， 有th:each ##### Conditional evaluation 条件判断， 如jsp的if， 有th:if,th:unless,th:saitch,th:case, ##### 后边的还有很多，这里就不展开、 #### 表达式 参见文档4 Standard Experssion Syntax 文档我就不贴过来了。。挺清楚的，这个应该不是我目前的重点。