精华内容
下载资源
问答
  • SpringBoot模板引擎

    千次阅读 2019-02-28 19:58:55
    SpringBoot模板引擎 模板引擎简介 模板引擎作用 市面上的模板引擎有:JSP、Velocity、Freemarker、Thymeleaf; 之前开发用jsp当摸吧引擎,但是springboot的特殊机制,使得springboot不支持jsp...

    SpringBoot之模板引擎

    模板引擎简介

    • 模板引擎作用
      在这里插入图片描述

    • 市面上的模板引擎有:JSP、Velocity、Freemarker、Thymeleaf;

    • 之前开发用jsp当摸吧引擎,但是springboot的特殊机制,使得springboot不支持jsp页面,但这样会有很多开发上的不方便,所以他支持了Thymelead模板引擎。

    Thymeleaf语法

    • 特点:相比jsp,他语法更简单,功能更加强大。

    • 引入thymeleaf

      <dependency>
           <groupId>org.springframework.boot</groupId>
           <artifactId>spring-boot-starter-thymeleaf</artifactId>
      </dependency>
      
    • 语法

      • 只要我们把HTML页面放在classpath:/templates/目录下,thymeleaf就能自动帮我们渲染页面。

        • 例如

              @RequestMapping("/success")
              public String success(){
                  return "success";
              }
          
        • 目录结构
          在这里插入图片描述

      • 为页面加入语法提示,引入命名空间

        <html lang="en" xmlns:th="http://www.thymeleaf.org">
        
      • 使用thymeleaf语法

        • 后端

              @RequestMapping("/success")
              public String success(Map<String,String> map){
                  map.put("hello","你好");
                  return "success";
              }
          
        • 将容器中文本内容设置为指定的内容——th:text

          <div th:text="${hello}"></div>
          

          这样好处是,如果div里面原本有文本,不经过thymeleaf渲染的话,就显示原本内容,thymeleaf文本不影响

      • 语法规则

        • th:text:改变当前元素里面的文本内容

        • th:任意html属性:来替换原声html里面属性的值

        • 一些较为复杂语法
          在这里插入图片描述

        • 表达式

          1. 获取对象属性、调用方法

          2. 使用内置的基本对象

          3. 内置工具对象

            详情参考usingthymeleaf手册

            *{}和${}在功能上一致,只是有一个补充的功能,配合th:object使用

          4. '#{}'是用来获取国际化内容的

          5. @{}是用来定义url链接的

            <!-- Will produce 'http://localhost:8080/gtvg/order/details?orderId=3' (plus rewriting) -->
            <a href="details.html"
            th:href="@{http://localhost:8080/gtvg/order/details(orderId=${o.id})}">view</a>
            
            • 如果是多个参数的话

              @{/order/process(execId=${execId},execType='FAST')} 
              

      支持数学运算、布尔运算、比较运算、

      示例

      • 代码

        • 后端

          package com.example.springbootdemo.controller;
          import org.springframework.stereotype.Controller;
          import org.springframework.web.bind.annotation.RequestMapping;
          import org.springframework.web.bind.annotation.ResponseBody;
          import java.util.Arrays;
          import java.util.Map;
          @Controller
          public class DemoController {
          
              @RequestMapping("/hello")
              @ResponseBody
              public String hello(){
                  return "hello world";
              }
          
              @RequestMapping("/success")
              public String success(Map<String,Object> map){
                  map.put("hello","<h1>你好</h1>");
                  map.put("users", Arrays.asList("zhangsan","lisi","wangwu"));
                  return "success";
              }
          }
          
        • 前端

          <!DOCTYPE html>
          <html lang="en" xmlns:th="http://www.thymeleaf.org">
          <head>
              <meta charset="UTF-8">
              <title>Title</title>
          </head>
          <body>
          <h1>成功访问!</h1>
          <div th:text="${hello}"></div>
          <div th:text="${hello}"></div>
          <div th:utext="${hello}"></div>
          <!--遍历数组-->
          <!--th:each每次遍历都会生成一个当前这个标签-->
          <h4 th:text="${user}" th:each="user:${users}"></h4>
          <hr>
          <!--[]转义特殊字符-->
          <h4>
              <span th:each="user:${users}">[[${user}]]</span>
          </h4>
          </body>
          </html>
          
        • 效果
          在这里插入图片描述

          • 查看生成源代码

            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <title>Title</title>
            </head>
            <body>
            <h1>成功访问!</h1>
            <div>&lt;h1&gt;你好&lt;/h1&gt;</div>
            <div>&lt;h1&gt;你好&lt;/h1&gt;</div>
            <div><h1>你好</h1></div>
            <!--遍历数组-->
            <!--th:each每次遍历都会生成一个当前这个标签-->
            <h4>zhangsan</h4>
            <h4>lisi</h4>
            <h4>wangwu</h4>
            <hr>
            <!--[]转义特殊字符-->
            <h4>
                <span>zhangsan</span><span>lisi</span><span>wangwu</span>
            </h4>
            </body>
            </html>
            
    展开全文
  • 1 第2-3课:模板引擎 Thymeleaf 基础使用 1.1 模板引擎 模板引擎是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的 HTML 文档。 模板引擎的实现...

    1    第2-3课:模板引擎 Thymeleaf 基础使用

    1.1     模板引擎

    模板引擎是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的 HTML 文档。

    模板引擎的实现方式有很多,最简单的是“置换型”模板引擎,这类模板引擎只是将指定模板内容(字符串)中的特定标记(子字符串)替换,便生成了最终需要的业务数据(如网页)。

    “置换型”模板引擎实现简单,但其效率低下,无法满足高负载的应用需求(比如有海量访问的网站),因此还出现了“解释型”模板引擎和“编译型”模板引擎等。

    1.2     Thymeleaf 介绍

    Thymeleaf 是⾯向 Web 和独⽴环境的现代服务器端 Java 模板引擎,能够处理 HTML、XML、JavaScript、CSS 甚⾄纯⽂本。

    Thymeleaf 旨在提供⼀个优雅的、⾼度可维护的创建模板的⽅式。为了实现这⼀⽬标,Thymeleaf 建⽴在⾃然模板的概念上,将其逻辑注⼊到模板⽂件中,不会影响模板设计原型,从而改善了设计的沟通,弥合了设计和开发团队之间的差距。

    Thymeleaf 从设计之初就遵循 Web 标准——特别是 HTML 5 标准,如果需要,Thymeleaf 允许创建完全符合 HTML 5 验证标准的模板。

    Spring Boot 体系内推荐使用 Thymeleaf 作为前端页面模板,并且 Spring Boot 2.0 中默认使用 Thymeleaf 3.0,性能提升幅度很大。

    1.2.1   Thymeleaf 特点

    简单说,Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎,它可以完全替代 JSP。与其他的模板引擎相比较,它有如下三个极吸引人的特点。

    • Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持 HTML 原型,然后在 HTML 标签里增加额外的属性来达到模板 + 数据的展示方式。浏览器解释 HTML 时会忽略未定义的标签属性,所以 Thymeleaf 的模板可以静态地运行;当有数据返回到页面时,Thymeleaf 标签会动态地替换掉静态内容,使页面动态显示。
    • Thymeleaf 开箱即用的特性。它支持标准方言和 Spring 方言,可以直接套用模板实现 JSTL、 OGNL 表达式效果,避免每天套模板、改 JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
    • Thymeleaf 提供 Spring 标准方言和一个与 SpringMVC 完美集成的可选模块,可以快速地实现表单绑定、属性编辑器、国际化等功能。

    对比

    我们可以对比一下 Thymeleaf 和常用的模板引擎:Velocity、Freemaker,和其他模板一起不同的是,它使用了自然的模板技术。这意味着 Thymeleaf 的模板语法并不会破坏文档的结构,模板依旧是有效的 XML 文档。模板还可以用做工作原型,Thymeleaf 会在运行期替换掉静态值。Velocity 与 FreeMarker 则是连续的文本处理器。

    下面的代码示例分别使用 Velocity、FreeMarker 与 Thymeleaf 打印出一条消息:

    Velocity: <p>$message</p>
    FreeMarker: <p>${message}</p>
    Thymeleaf: <p th:text="${message}">Hello World!</p>

    上面我们可以看出来 Thymeleaf 的作用域在 HTML 标签内,类似标签的一个属性来使用,这就是它的特点。

    注意,由于 Thymeleaf 使用了 XML DOM 解析器,因此它并不适合于处理大规模的 XML 文件。

    1.3     快速上手

    来一个 Thymeleaf 的 Hello World 尝尝鲜。

    1.3.1   相关配置

    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

    在 application.properties 中添加配置:

    spring.thymeleaf.cache=false

    其中,propertiesspring.thymeleaf.cache=false 是关闭 Thymeleaf 的缓存,不然在开发过程中修改页面不会立刻生效需要重启,生产可配置为 true。

    1.3.2   一个简单的页面

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Hello</title>
    </head>
    <body>
    <h1  th:text="${message}">Hello World</h1>
    </body>
    </html>

    所有使用 Thymeleaf 的页面必须在 HTML 标签声明 Thymeleaf:

    <html xmlns:th="http://www.thymeleaf.org">

    表明页面使用的是 Thymeleaf 语法。

    1.3.3   Controller

    @Controller
    public class HelloController {
        @RequestMapping("/")
        public String index(ModelMap map) {
            map.addAttribute("message", "http://www.ityouknow.com");
            return "hello";
        }
    }

    这样就完成了,是不是很简单。启动项目后在浏览器中输入网址:http://localhost:8080/,会出现下面的结果:

    http://www.ityouknow.com

    说明页面的值,已经成功的被后端传入的内容所替换。

    1.4     常用语法

    我们新建 ExampleController 来封装不同的方法进行演示。

    1.4.1   赋值、字符串拼接

    赋值和拼接:

    <p th:text="${userName}">neo</p>
    <span th:text="'Welcome to our application, ' + ${userName} + '!'"></span>

    字符串拼接还有另外一种简洁的写法:

    <span th:text="|Welcome to our application, ${userName}!|"></span>

    页面 string.html:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example String </title>
    </head>
    <body>
        <div >
            <h1>text</h1>
            <p th:text="${userName}">neo</p>
            <span th:text="'Welcome to our application, ' + ${userName} + '!'"></span>
            <br/>
            <span th:text="|Welcome to our application, ${userName}!|"></span>
        </div>
    </body>
    </html>

    后端传值:

    @RequestMapping("/string")
    public String string(ModelMap map) {
        map.addAttribute("userName", "ityouknow");
        return "string";
    }

    使用 ModelMap 以 KV 的方式存储传递到页面。

    启动项目后在浏览器中输入网址:http://localhost:8080/string,会出现下面的结果:

    text
     
    ityouknow
     
    Welcome to our application, ityouknow! 
    Welcome to our application, ityouknow!

    1.4.2   条件判断 If/Unless

    Thymeleaf 中使用 th:if 和 th:unless 属性进行条件判断,在下面的例子中,<a> 标签只有在 th:if 中条件成立时才显示:

    <a th:if="${flag == 'yes'}"  th:href="@{http://favorites.ren/}"> home </a>
    <a th:unless="${flag != 'no'}" th:href="@{http://www.ityouknow.com/}" >ityouknow</a>

    th:unless 与 th:if 恰好相反,只有表达式中的条件不成立,才会显示其内容。

    页面 if.html:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example If/Unless </title>
    </head>
    <body>
    <div >
        <h1>If/Unless</h1>
        <a th:if="${flag == 'yes'}"  th:href="@{http://favorites.ren/}"> home </a>
        <br/>
        <a th:unless="${flag != 'no'}" th:href="@{http://www.ityouknow.com/}" >ityouknow</a>
    </div>
    </body>
    </html>

    后端传值:

    @RequestMapping("/if")
    public String ifunless(ModelMap map) {
        map.addAttribute("flag", "yes");
        return "if";
    }

    使用 ModelMap 以 KV 的方式存储传递到页面。

    启动项目后在浏览器中输入网址:http://localhost:8080/if,会出现下面的结果:

    If/Unless
     
    home 

    单击 home 链接会跳转到:http://favorites.ren/ 地址。

    1.4.3   for 循环

    for 循环在我们项目中使用的频率太高了,一般结合前端的表格来使用。

    首先在后端定义一个用户列表:

    private List<User> getUserList(){
        List<User> list=new ArrayList<User>();
        User user1=new User("大牛",12,"123456");
        User user2=new User("小牛",6,"123563");
        User user3=new User("纯洁的微笑",66,"666666");
        list.add(user1);
        list.add(user2);
        list.add(user3);
        return  list;
    }

    按照键 users,传递到前端:

    @RequestMapping("/list")
    public String list(ModelMap map) {
        map.addAttribute("users", getUserList());
        return "list";
    }

    页面 list.html 进行数据展示:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example If/Unless </title>
    </head>
    <body>
    <div >
        <h1>for 循环</h1>
        <table>
            <tr  th:each="user,iterStat : ${users}">
                <td th:text="${user.name}">neo</td>
                <td th:text="${user.age}">6</td>
                <td th:text="${user.pass}">213</td>
                <td th:text="${iterStat.index}">index</td>
            </tr>
        </table>
    </div>
    </body>
    </html>

    iterStat 称作状态变量,属性有:

    • index,当前迭代对象的 index(从 0 开始计算);
    • count,当前迭代对象的 index(从 1 开始计算);
    • size,被迭代对象的大小;
    • current,当前迭代变量;
    • even/odd,布尔值,当前循环是否是偶数/奇数(从 0 开始计算);
    • first,布尔值,当前循环是否是第一个;
    • last,布尔值,当前循环是否是最后一个。

    在浏览器中输入网址:http://localhost:8080/list,页面展示效果如下:

    for 循环
    大牛  12  123456  0
    小牛  6   123563  1
    纯洁的微笑   66  666666  2

    1.4.4   URL

    URL 在 Web 应用模板中占据着十分重要的地位,需要特别注意的是 Thymeleaf 对于 URL 的处理是通过语法@{...}来处理的。如果需要 Thymeleaf 对 URL 进行渲染,那么务必使用 th:href、th:src 等属性,下面是一个例子:

    <a th:href="@{http://www.ityouknow.com/{type}(type=${type})}">link1</a>
    <a th:href="@{http://www.ityouknow.com/{pageId}/can-use-springcloud.html(pageId=${pageId})}">view</a>

    也可以使用@{...}设置背景:

    <div th:style="'background:url(' + @{${img url}} + ');'">

    几点说明:

    • 上例中 URL 最后的(pageId=${pageId})表示将括号内的内容作为 URL 参数处理,该语法避免使用字符串拼接,大大提高了可读性;
    • @{...}表达式中可以通过{pageId}访问 Context 中的 pageId 变量;
    • @{/order}是 Context 相关的相对路径,在渲染时会自动添加上当前 Web 应用的 Context 名字,假设 context 名字为 app,那么结果应该是 /app/order

    完整的页面内容 url.html:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example If/Unless </title>
    </head>
    <body>
    <div >
        <h1>URL</h1>
        <a  th:href="@{http://www.ityouknow.com/{type}(type=${type})}">link1</a>
        <br/>
        <a th:href="@{http://www.ityouknow.com/{pageId}/can-use-springcloud.html(pageId=${pageId})}">view</a>
        <br/>
        <div th:style="'background:url(' + @{${img}} + ');'">
            <br/><br/><br/>
        </div>
    </div>
    </body>
    </html>

    后端程序:

    @RequestMapping("/url")
    public String url(ModelMap map) {
        map.addAttribute("type", "link");
        map.addAttribute("pageId", "springcloud/2017/09/11/");
        map.addAttribute("img", "http://www.ityouknow.com/assets/images/neo.jpg");
        return "url";
    }

    在浏览器中输入网址:http://localhost:8080/url,页面展示效果:

     

    1.4.5   三目运算

    三目运算是我们常用的功能之一,普遍应用在各个项目中,下面来做一下演示。

    三目运算及表单显示:

    <input th:value="${name}"/>
    <input th:value="${age gt 30 ? '中年':'年轻'}"/>

    说明:在表单标签中显示内容使用:th:value;${age gt 30 ? '中年':'年轻'}表示如果 age 大于 30 则显示中年,否则显示年轻。

    • gt:great than(大于) 
    • ge:great equal(大于等于) 
    • eq:equal(等于) 
    • lt:less than(小于) 
    • le:less equal(小于等于) 
    • ne:not equal(不等于) 

    结合三目运算也可以将上面的 if else 改成这样:

    <a th:if="${flag eq 'yes'}"  th:href="@{http://favorites.ren/}"> favorites </a>

    完整的页面内容 eq.html:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example If/Unless </title>
    </head>
    <body>
    <div >
        <h1>EQ</h1>
        <input th:value="${name}"/>
        <br/>
        <input th:value="${age gt 30 ? '中年':'年轻'}"/>
        <br/>
        <a th:if="${flag eq 'yes'}"  th:href="@{http://favorites.ren/}"> favorites </a>
    </div>
    </body>
    </html>

    后端程序:

    @RequestMapping("/eq")
    public String eq(ModelMap map) {
        map.addAttribute("name", "neo");
        map.addAttribute("age", 30);
        map.addAttribute("flag", "yes");
        return "eq";
    }

    在浏览器中输入网址:http://localhost:8080/eq,页面展示效果如下:

    EQ
     
    neo
    年轻
     
    favorites

    单击 favorites 链接会跳转到:http://favorites.ren/ 地址。

    1.4.6   switch 选择

    switch\case 多用于多条件判断的场景下,以性别举例:

    <!DOCTYPE html>
    <html lang="en"  xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"></meta>
        <title>Example switch </title>
    </head>
    <body>
    <div >
        <div th:switch="${sex}">
            <p th:case="'woman'">她是一个姑娘...</p>
            <p th:case="'man'">这是一个爷们!</p>
            <!-- *: case的默认的选项 -->
            <p th:case="*">未知性别的一个家伙。</p>
        </div>
    </div>
    </body>
    </html>

    后端程序:

    @RequestMapping("/switch")
    public String switchcase(ModelMap map) {
        map.addAttribute("sex", "woman");
        return "switch";
    }

    在浏览器中输入网址:http://localhost:8080/switch,页面展示效果如下:

    她是一个姑娘...

    可以在后台改 sex 的值来查看结果。

    1.5     总结

    本课介绍了模板引擎、Thymeleaf 的使用特点、应用场景,通过实例演练展示了 Thymeleaf 各种语法特性。通过学习可以了解到,Thymeleaf 是一个非常灵活和优秀的前端页面模板引擎,使用 Thymeleaf 可以非常灵活地展示页面内容。

    点击这里下载源码

     

    转载于:https://www.cnblogs.com/zyt528/p/9771066.html

    展开全文
  • SpringBoot系列之集成jsp模板引擎

    千次阅读 2019-12-08 19:32:44
    SpringBoot系列之集成jsp模板引擎 文章目录1、模板引擎简介2、环境准备3、外部Servlet容器4、源码原理简介 1、模板引擎简介 引用百度百科的模板引擎解释: 模板引擎(这里特指用于Web开发的模板引擎)是为了使用户...

    SpringBoot系列之集成jsp模板引擎

    1、模板引擎简介

    引用百度百科的模板引擎解释:

    模板引擎(这里特指用于Web开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的HTML文档。

    在JavaEE领域有几中比较常用的模板引擎,分别是Jsp、Velocity、Freemarker、Thymeleaf,不过对于前端页面渲染效率来说,jsp其实还是最快的,Velocity次之。Thymeleaf虽然渲染效率不是很快,但是语法方面是比较轻巧的,Thymeleaf语法比Velocity轻巧,但是渲染效率不如Velocity

    2、环境准备

    ok,Springboot是一款javaee框架,使用非常简捷,创建工程也是默认打成jar包的,启动jar包就可以直接运行嵌入式的Servlet容器,比如Tomcat等等,不过Springboot要集成模板引擎的话,是默认不支持jsp的,但是并不表示不能使用,首先Springboot项目默认是jar方式运行的,而我们之前的jsp

    展开全文
  • 本文主要介绍SpringBoot给我们推荐的Thymeleaf模板引擎,这是一个高级语言的模板引擎,语法更简单且功能更强大 参考:https://www.jianshu.com/p/7c27c50f24ec 1. 引入 在以前,我们通常将前端交给我们的...
     
    


    本文主要介绍SpringBoot给我们推荐的Thymeleaf模板引擎,这是一个高级语言的模板引擎,语法更简单且功能更强大

    参考:https://www.jianshu.com/p/7c27c50f24ec

    1. 引入

    在以前,我们通常将前端交给我们的html页面转成jsp页面,通过jsp轻松实现数据的显示,及前后端交互等。

    jsp支持非常强大的功能,能写Java代码,但是springboot默认是不支持jsp的

    如果直接用纯静态页面的方式,开发会十分麻烦,这就引入了模板引擎



    2. 什么是模板引擎?

    模板引擎是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的[HTML]文档;SpringBoot推荐使用模板引擎

    ZWPF0M5W_CR_NEUY6H46__W

    • 模板引擎有非常多,过去的jsp就是一个模板引擎,还有用的比较多的freemarker,包括SpringBoot给推荐的Thymeleaf

    • 模板引擎很多,但原理都是如下所示:
      在这里插入图片描述

    • 当我们写一个页面模板,有些值是我们在后台封装的一些数据,是动态的,我们会写一些表达式取出这些值。模板引擎按照这些数据帮你把这表达式解析、填充到我们指定的位置,最终把这个数据生成一个我们想要的内容写出

    • 所有的模板引擎原理都一致,只是不同模板引擎的语法会不同

    • 模板技术并不是什么神秘技术,干的是拼接字符串的体力活。模板引擎就是利用正则表达式识别模板标识,并利用数据替换其中的标识符

    常用模板引擎对比
    image-20200923214737908



    3. Thymeleaf

    1. 简介

    Thymeleaf 的主要目标是将优雅的自然模板带到您的开发工作流程中—HTML能够在浏览器中正确显示,并且可以作为静态原型,从而在开发团队中实现更强大的协作。Thymeleaf能够处理HTML,XML,JavaScript,CSS甚至纯文本。
    image-20200923214427073

    • thymeleaf可处理六种模板,每种模板称为模板模式:

      有两种标记模板模式(HTML、XML)

      三个文本模板模式(TEXT、JAVASCRIPT、CSS)

      无操作模板模式(RAW)

    Thymeleaf 官网https://www.thymeleaf.org/

    Github地址https://github.com/thymeleaf/thymeleaf

    官网文档https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#what-kind-of-templates-can-thymeleaf-process


    2. 导入Thymeleaf

    当前版本为3.x,只需导入下方一个依赖即可

    <!--thymeleaf-->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    
     
    • 导入依赖后,查看jar包是否导入
      image-20200922231528040
      可以发现自动导入了下面两个包(2.x的版本需要单独导入以下两个依赖)

      <dependency>
      	<groupId>org.thymeleaf</groupId>
      	<artifactId>thymeleaf-spring5</artifactId>
      </dependency>
      <dependency>
      	<groupId>org.thymeleaf.extras</groupId>
      	<artifactId>thymeleaf-extras-java8time</artifactId>
      </dependency>
      
         

        3. 使用Thymeleaf

        我们首先得按照SpringBoot的自动配置原理看一下我们这个Thymeleaf的自动配置规则,在按照那个规则,我们进行使用。

        我们去找一下Thymeleaf的自动配置类:ThymeleafProperties
        image-20200922232535328
        可以看到默认的前缀和后缀,就是Thymeleaf的视图解析器

        总结:使用thymeleaf只需要导入对应的依赖,然后将html页面放在resource下的templates目录即可,thymeleaf就可以帮我们自动渲染了


        4. 简单测试

        1、编写一个TestController
        image-20200923212322017

        
        
      package com.zsr.controller;
      import org.springframework.stereotype.Controller;
      import org.springframework.ui.Model;
      import org.springframework.web.bind.annotation.RequestMapping;
      
      @Controller
      public class TestController {
          @RequestMapping("/test")
          public String TestThymeleaf(Model model) {
              model.addAttribute("msg", "Hello,Thymeleaf");
              return "test";
          }
      }
      

      2、编写一个测试页面 test.html 放在 templates 目录下
      image-20200923210314616

      首先引入thymeleaf命名空间约束

      xmlns:th="http://www.thymeleaf.org"
      
       
      • 1
      <!DOCTYPE html>
      <html lang="en" xmlns:th="http://www.thymeleaf.org">
      <head>
          <meta charset="UTF-8">
          <title>测试Thymeleaf</title>
      </head>
      <body>
      <!--th:text就是将div中的内容设置为它指定的值-->
      <div th:text="${msg}"></div>
      </body>
      </html>
      
       

        3、启动项目请求测试

        访问http://localhost:8080/test
        image-20200923140335602

        成功取到值


        5. thymeleaf语法

        参考:https://www.cnblogs.com/itdragon/archive/2018/04/13/8724291.html

        https://www.cnblogs.com/jnba/p/10832878.html

        1、th属性

        th:text:文本替换;

        th:utext:支持html的文本替换。

        th:value:属性赋值

        th:each:遍历循环元素

        th:if:判断条件,类似的还有th:unlessth:switchth:case

        th:insert:代码块引入,类似的还有th:replace,th:include,常用于公共代码块提取的场景

        th:fragment:定义代码块,方便被th:insert引用

        th:object:声明变量,一般和*{}一起配合使用,达到偷懒的效果。

        th:attr:设置标签属性,多个属性可以用逗号分隔

        2、标准表达式语法

        ${...} 变量表达式,Variable Expressions

        #常用的内置对象
        `ctx` :上下文对象
        `vars` :上下文变量
        `locale`:上下文的语言环境
        `request`:(仅在web上下文)的 HttpServletRequest 对象
        `response`:(仅在web上下文)的 HttpServletResponse 对象
        `session`:(仅在web上下文)的 HttpSession 对象
        `servletContext`:(仅在web上下文)的 ServletContext 对象
        

        #常用的内置方法
        </span>strings<span class="token variable">:字符串格式化方法,常用的Java方法它都有,比如:equals,equalsIgnoreCase,length,trim,toUpperCase,toLowerCase,indexOf,substring,replace,startsWith,endsWith,contains,containsIgnoreCase等
        </span>numbers<span class="token variable">:数值格式化方法,常用的方法有:formatDecimal等
        </span>bools<span class="token variable">:布尔方法,常用的方法有:isTrue,isFalse等
        </span>arrays<span class="token variable">:数组方法,常用的方法有:toArray,length,isEmpty,contains,containsAll等
        </span>lists<span class="token variable">,</span>sets<span class="token variable">:集合方法,常用的方法有:toList,size,isEmpty,contains,containsAll,sort等
        </span>maps<span class="token variable">:对象方法,常用的方法有:size,isEmpty,containsKey,containsValue等
        </span>dates<span class="token variable">:日期方法,常用的方法有:format,year,month,hour,createNow等

        展开全文
      • 但是springboot默认是不支持jsp的。 如果直接用纯静态页面的方式,开发会十分...SpringBoot推荐使用模板引擎 模板引擎很多,但原理都是如下所示: 模板引擎的作用就是我们来写一个页面模板,比如有些值呢,是动态的
      • freemarker和thymeleaf是模板引擎。在早前我们使用Struts或者SpringMVC等框架的时候,使用的都是jsp,jsp的本质其实就是一个Servlet,其中的数据需要在后端进行渲染,然后再在客户端显示,效率比较低下。而模板引擎...
      • SpringBoot-Thymeleaf模板引擎整合及基本用法总结(一) 模板引擎引入Thymeleaf内置方法常用标签 (一) 模板引擎引入 (1) 开发方式 在往常的开发中,一旦涉及到一个完整的前后端项目,有两种办法: 一种就是前后端分离...
      • Java后端模板引擎对比

        千次阅读 2020-12-17 22:17:20
        一、什么是模板引擎 模板引擎是为了解决用户界面(显示)与业务数据(内容)分离而产生的。他可以生成特定格式的文档,常用的如格式如HTML、xml以及其他格式的文本格式。其工作模式如下: [外链图片转存失败,源站...
      • 与其它模板引擎相比,Thymeleaf最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个Web应用。它的功能特性如下: Spring MVC中@Controller中的方法可以直接返回模板名称,接下来Thymeleaf...
      • 与其它模板引擎相比,Thymeleaf最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个Web应用。它的功能特性如下: Spring MVC中@Controller中的方法可以直接返回模板名称,接下来Thymeleaf...
      • SpringBoot对静态资源的映射规则,Webjar以jar包的形式引入静态资源,使用前端的各种框架Webjar的使用,将这些通用的Web前端资源打包成Java的Jar包,然后借助Maven工具对其管理模板引擎,将静态页面渲染成jsp这种...
      • 一、模板引擎 原文 (1)除了REST Web服务之外,您还可以使用Spring MVC来提供动态HTML内容。Spring MVC支持各种模板技术,包括Thymeleaf,FreeMarker、Velocity和JSP。同样,许多其他模板引擎包括它们自己的...
      • Velocity 是一个基于Java的模板引擎(template engine). 它可以让视图的设计者在web 页面中引用java 代码中定义的数据对象和命令。 项目架构: 注意:springboot版本使用1.4.7版的,因为高版本的springboot不支持...
      • SpringBoot-web开发(三): 模板引擎Thymeleaf

        千次阅读 多人点赞 2020-09-23 22:50:07
        本文主要介绍SpringBoot给我们推荐的Thymeleaf模板引擎,这是一个高级语言的模板引擎,语法更简单且功能更强大 参考:https://www.jianshu.com/p/7c27c50f24ec 1. 引入 在以前,我们通常将前端交给我们的html页面...
      • SpringBoot+Thymeleaf超好用的前后端数据交互模板引擎

        万次阅读 多人点赞 2019-03-01 15:11:00
        除了普通的SpringBoot项目,版本选择1.5.10,除了引入Web模块的场景启动器,数据库模块等等之外,还需要thymeleaf的场景启动器,为了兼容性,还需要指定thymeleaf较高的版本 ,pom文件主要的依赖如下(包含但不仅...
      • 至此模板引擎技术发展仿似至臻之境,但前后端分离的开发技术业已出现,在很多公司,现在起步的项目都是前后端分离了,后端项目只需要提供返回json的接口即可,模板引擎技术也开始越来越少使用,技术的发展层出不迭,...
      • 一.前期工作 1.添加依赖 <!--thymeleaf引擎模板--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-star...
      • 兴趣的朋友可以去了解一下前四篇,你的赞就是对我最大的支持,感谢大家! (一) SpringBoot起飞之路-HelloWorld (二) SpringBoot起飞之路-入门原理分析 (三) SpringBoot起飞之路-YAML配置...(一) 模板引擎引入 (1) 开发.
      • 1.Thymeleaf ...这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板+数据的展示方式。浏览器解释 html 时会忽略未定义的标签属性,所以 thymeleaf 的模板可以静态地运行;当...
      • 1、SpringBoot Starter讲解 简介:介绍什么是SpringBoot Starter和主要作用 1、官网地址:https://docs.spring.io/spring-boot/docs/2.1.0.BUILD-SNAPSHOT/reference/htmlsingle/#using-boot-starter 2、...
      • import org.springframework.boot.test.context.SpringBootTest; import org.springframework.test.context.junit4.SpringRunner; import zkrun.top.web.bean.UserInfo; import zkrun.top.web.mapper.UserInfoMapper...
      • 其中Reactor Netty是默认的web引擎(spring-boot-starter-reactor-netty)。 Reactive数据库支持 Spring Boot 2.0 对一下的数据库提供了自动配置( auto-configuration )的reactive的支持: MongoDB (spring-...
      • 解决的问题领域是网站应用程序或者服务开发——URL路由、Session、模板引擎、静态Web资源等等。 Spring Boot的功能 Spring Boot实现了自动配置,降低了项目搭建的复杂度。 众所周知Spring框架需要进行大量...

      空空如也

      空空如也

      1 2 3 4 5 ... 20
      收藏数 1,966
      精华内容 786
      关键字:

      springboot模板引擎对比

      spring 订阅