美文网首页
【学习笔记】SpringBoot之Thymeleaf(一)

【学习笔记】SpringBoot之Thymeleaf(一)

作者: 苯基乙胺 | 来源:发表于2018-09-14 23:44 被阅读0次

    配置Thymeleaf

    1. 需要在poom文件中引入一个依赖,自动加入Jar包
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-starter-thymeleaf</artifactId>
            </dependency>
    
    • 如果需要更改版本信息,可以去查看一下官方文档,需要加入一个Start和一个Layout,Layout和Thymeleaf
            <properties>
                <thymeleaf.version>3.0.9.RELEASE</thymeleaf.version>
                <!--Layout的版本不必须要和上面的Thymeleaf版本一致-->
                 <thymeleaf‐layout‐dialect.version>2.2.2</thymeleaf‐layout‐dialect.version>
             </properties>
    

    Thymeleaf语法

    • 先来看看Thymeleaf的内部一些文件
    @ConfigurationProperties(prefix="spring.thymeleaf")
     publicclassThymeleafProperties{
    
     private static final Charset DEFAULT_ENCODING = Charset.forName("UTF‐8"); 5
     private static final MimeType DEFAULT_CONTENT_TYPE = MimeType.valueOf("text/html"); 7
     public static final String DEFAULT_PREFIX = "classpath:/templates/";
    
     public static final String DEFAULT_SUFFIX = ".html";
     //
    
    只要我们把HTML页面放在classpath:/templates/,thymeleaf就能自动渲染

    1.导入一下Thymeleaf的命名空间 可以让你在Html中有代码提示

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

    2.Thymeleaf的语法规则

    • 只能在标签页面里面加入 th:XXX
    • th:任意html属性可以更改原来的属性值
    Thymeleaf语法

    3.Thymeleaf表达式都有什么

     Simpleexpressions:(表达式语法)
        Variable Expressions: ${...}:获取变量值;OGNL;
        1)、获取对象的属性、调用方法 
        2)、使用内置的基本对象:
              #ctx : the context object.
              #vars: the context variables.
              #locale : the context locale.
              #request : (only in Web Contexts) the HttpServletRequest object.
              #response : (only in Web Contexts) the HttpServletResponse object.
              #session : (only in Web Contexts) the HttpSession object.
              #servletContext : (only in Web Contexts) the ServletContexobject.
    
    
    Selection Variable Expressions: *{...}:选择表达式:和${}在功能上是一样;
    补充:配合 th:object="${session.user}:
       <div th:object="${session.user}">
        <p>Name: <span th:text="*{firstName}">Sebastian</span>.</p>
        <p>Surname: <span th:text="*{lastName}">Pepper</span>.</p>
        <p>Nationality: <span th:text="*{nationality}">Saturn</span>.</p>
        </div>
    Message Expressions: #{...}:获取国际化内容 
    
    
    Link URL Expressions: @{...}:定义URL;
    @{/order/process(execId=${execId},execType='FAST')} 
    <!--中间的execid 相当于之前我们要用到的 ?一样-->
    
    Fragment Expressions: <!-- ~{...}:片段引用表达式-->
                <div th:insert="~{commons :: main}">...</div>
    

    简单的小测试

    1. 首先按照语法规则,我们在templates目录下面创建一个html文件,我们先给它命名为success,然后引入Thymeleaf的语法标记库
    • 然后在路径下面创建一个Controller,起一个名字,HelloController,然后在这个Java类里面,写入一个Map,用来给Success传值,一会显示出这些数据
    package com.example.demo.controller;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.ResponseBody;
    
    import java.util.ArrayList;
    import java.util.Arrays;
    import java.util.List;
    import java.util.Map;
    
    @Controller
    public class HelloController {
    
    
       @RequestMapping("/success")   //一会要访问映射地址
       //classpath:templates/success
       public String success(Map<String,Object> map){
           map.put("hello","<h1>你好<h1>");
           map.put("usr", Arrays.asList("zhangsna","lisi","wanger"));
           return "success";   //页面的地址
       }
    }
    
    
    • 应该能感觉到SpringBoot的强大,不需要繁琐的东西,直接就能找到我们需要的页面
    1. 继续返回刚刚的页面,我们现在可以试试我们刚刚学到的一些语法规则
      • 首先来试试最简单的一个 <th:text>,这里需要注意一下标记库里面有一个是<th:utext>这个是不会转义,第一种是会转义的,也就是会不会识别特殊的一些转义符号 在html当中
      <!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>
        </br>
      
        <div th:utext="${hello}">
        </div>
        </br>
        </body>
        </html>
      
      • ok 这样的话 实际只是拿出来了我们在Controller中的一组数据,中间用分割线分开一下,看看转义和不转义的效果是什么样的...然后那我们来试试用遍历拿出List里面的数据.
       <!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}"/>
          </br>
      
         <div th:utext="${hello}">
         </div>
         </br>
             <h2>
                 <span th:each="usr:${usr}">[[${usr}]]</br></span>
             </h2>
         </div>
         </body>
         </html>
      
      • 这样的话我们就能遍历出list里面的数据,但是注意一点,[[]]这个的含义实际是th:text 没有写在span标签里面,如果用[{}]表示的是utext,而且这样遍历的花会显示3个span,如果th:each卸载了h2里面就会有3个h2 这一点需要注意
      yes

    相关文章

      网友评论

          本文标题:【学习笔记】SpringBoot之Thymeleaf(一)

          本文链接:https://www.haomeiwen.com/subject/ydaggftx.html