• Thymeleaf语法


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

    1.入门示例

    (1)在controller编写一个请求,放进去一些数据;

    @RequestMapping("/success")
    public String success(Model model){
        //存入数据
        model.addAttribute("msg","Hello,Thymeleaf");
        //classpath:/templates/success.html
        return "success";
    }
    

    (2)我们要使用thymeleaf,需要在html文件中导入命名空间的约束,方便提示。我们可以去官方文档的#3中看一下命名空间拿来过来

     xmlns:th="http://www.thymeleaf.org"
    

    (3)我们去编写下前端页面 success,html

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>BAO</title>
    </head>
    <body>
    
    <div th:text="${msg}">hello</div>
    </body>
    </html>
    

    注意: $ 表达式只能写在th标签内部,不然不会生效

    (4)访问localhost:8080/success

    (5)表达式的使用选择

    Variable Expressions: ${...}:获取变量值;OGNL;
    Selection Variable Expressions: *{...}:选择表达式:和${}在功能上是一样
    Message Expressions: #{...}:获取国际化内容
    Link URL Expressions: @{...}:定义URL;
    Fragment Expressions: ~{...}:片段引用表达式
    
    

    (6)关闭缓存,实现页面刷新加载

    spring:
      thymeleaf:
        cache: false # 开发时关闭缓存,不然没法看到实时页面
        mode: HTML # 用非严格的 HTML
        encoding: UTF-8
        servlet:
          content-type: text/html
    

    2.测试练习

    (1)我们编写一个Controller,放一些数据

    @RequestMapping("/success2")
    public String success2(Map<String,Object> map){
        //存入数据
        map.put("msg","<h1>Hello</h1>");
        map.put("users", Arrays.asList("bsq","qin"));
        //classpath:/templates/success.html
        return "success";
    }
    

    (2)前端页面

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>BAO说</title>
    </head>
    <body>
    <h1>Success</h1>
    
    <div th:text="${msg}"></div>
    <!--不转义-->
    <div th:utext="${msg}"></div>
    
    <!--遍历数据-->
    <!--th:each每次遍历都会生成当前这个标签:-->
    <h4 th:each="us :${users}" th:text="${us}"></h4>
    
    <h4>
        <!--行内写法:官网#12-->
        <span th:each="user:${users}">[[${user}]]</span>
    </h4>
    
    </body>
    </html>
    

    (4).使用工具类

    ​ ${#工具类.方法}

    (5)引入资源

    ​ @{/资源地址}

    3.常用语法

    (1)th:text :获取变量值

     <p th:text="'Hello!, ' + ${name} + '!'" >name</p>
    

    可以看出获取变量值用 $ 符号,对于javaBean的话使用 变量名.属性名 方式获取,这点和 EL 表达式一样.

    另外 $ 表达式只能写在th标签内部,不然不会生效,上面例子就是使用 th:text 标签的值替换 p 标签里面的值,至于 p 里面的原有的值只是为了给前端开发时做展示用的.这样的话很好的做到了前后端分离.

    (2)Thymeleaf 对于 URL 的处理是通过语法 @{…} 来处理的

    <a th:href="@{http://www.baidu.com}">绝对路径</a>
    <a th:href="@{/}">相对路径</a>
    <a th:href="@{css/bootstrap.min.css}">Content路径,默认访问static下的css文件夹</a>
    

    (3)字符串替换

    很多时候可能我们只需要对一大段文字中的某一处地方进行替换,可以通过字符串拼接操作完成:

    <span th:text="'Welcome to our application, ' + ${user.name} + '!'"> 
    

    一种更简洁的方式是:

    <span th:text="|Welcome to our application, ${user.name}!|"> 
    

    当然这种形式限制比较多,|…|中只能包含变量表达式${…},不能包含其他常量、条件表达式等。

    (4)th:each :循环

    渲染列表数据是一种非常常见的场景,例如现在有 n 条记录需要渲染成一个表格,该数据集合必须是可以遍历的,使用 th:each 标签:

    (5)运算符

    在表达式中可以使用各类算术运算符,例如+, -, *, /, %

    th:with="isEven=(${prodStat.count} % 2 == 0)" 
    

    逻辑运算符>, <, <=,>=,==,!=都可以使用,唯一需要注意的是使用<,>时需要用它的HTML转义符:

    th:if="${prodStat.count} > 1" th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')"
    

    (6)条件

    if/unless

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

    <a th:href="@{/login}" th:unless=${session.user != null}>Login</a>
    

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

    switch

    Thymeleaf 同样支持多路选择 Switch 结构:

    <div th:switch="${user.role}">
      <p th:case="'admin'">User is an administrator</p>
      <p th:case="#{roles.manager}">User is a manager</p>
    </div>
    

    默认属性 default 可以用 * 表示:

    <div th:switch="${user.role}">
      <p th:case="'admin'">User is an administrator</p>
      <p th:case="#{roles.manager}">User is a manager</p>
      <p th:case="*">User is some other thing</p>
    </div>
    

    每个优秀的人,都有一段沉默的时光.那段时光,是付出很多努力,却得不到结果的日子,我们把他叫做扎根
  • 相关阅读:
    胡昊—第9次作业--接口及接口回调
    胡昊—第8次作业--继承
    软件工程第三次作业——关于软件质量保障初探
    胡昊—第7次作业--访问权限、对象使用
    胡昊—第6次作业—static关键字、对象
    20194670自动生成四则运算题第一版报告
    《现代软件工程—构建之法》第一章总结
    第四次博客作业-结对项目
    第9次作业--接口及接口回调
    第八次作业--继承
  • 原文地址:https://www.cnblogs.com/sq-bmw/p/11988469.html
Copyright © 2020-2023  润新知