zoukankan      html  css  js  c++  java
  • thymeleaf 学习笔记

    thymeleaf 学习笔记

    什么是 thymeleaf?

    在后端渲染html页面方面,有多种模板引擎(JSP的替代物)可以使用(关于后端渲染/页面直出的好处,可以参考一下:Web性能优化之“直出”理论与实践总结

    实际开发或学习中,有多种模板引擎可供选择:
    - Thymeleaf
    - FreeMarker
    - Velocity
    - Groovy
    - Mustache

    总体上,thymeleaf 相较与其他的模板引擎,它有如下三个特点(该总结来源于网上!):
    1. Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。(当有数据返回到页面时,Thymeleaf 标签会动态地替换掉静态内容,使页面动态显示。)
    2. Thymeleaf 开箱即用的特性。(它提供标准和spring标准两种方言,可以直接套用模板实现JSTL、 OGNL表达式效果。)
    3. Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块,可以快速的实现表单绑定、属性编辑器、国际化等功能。

    另外,Thymeleaf是一个XML/XHTML/HTML5模板引擎,可用于Web与非Web环境中的应用开发。它是一个开源的Java库,基于Apache License 2.0许可,由Daniel Fernández创建,该作者还是Java加密库Jasypt的作者。

    thymeleaf 基础知识

    • maven 导包
    <dependency>
          <groupId>org.thymeleaf</groupId>
          <artifactId>thymeleaf</artifactId>
          <version>3.0.2.RELEASE</version>
        </dependency>
    
    •  增加头文件属性
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:th="http://www.thymeleaf.org">
    
    •  用th标签动态替换掉静态数据
    1. 后台传出的message会将静态数据“Old Message”替换掉  
    2. 访问静态页面,则显示数据“Old Message”  
    <td th:text="${message}">Old Message</td>
    

    springMVC 框架整合 thymeleaf

    1. maven 导包
    2. spring-web.xml 配置文件(即spring配置servlet的servlet.xml中)
    <!--springMVC+thymeleaf的跳转页面配置-->
    <bean id="templateResolver"
        class="org.thymeleaf.templateresolver.ServletContextTemplateResolver">
        <property name="prefix" value="/WEB-INF/" />
        <property name="suffix" value=".html" />
        <property name="templateMode" value="Html5" />
        <property name="characterEncoding" value="UTF-8"/>
    </bean>
    <bean id="templateEngine" class="org.thymeleaf.spring3.SpringTemplateEngine">
        <property name="templateResolver" ref="templateResolver" />
    </bean>
    <bean  id="thymeleafResolver"  class="org.thymeleaf.spring3.view.ThymeleafViewResolver">
        <property name="templateEngine" ref="templateEngine" />
        <property name="characterEncoding" value="UTF-8"/>
    </bean>
    

    spring boot 框架整合 thymeleaf

    将总结于 spring boot 学习之中。

    thymeleaf 的 th 标签

    一、th 标签的分类
    1. 变量表达式 ${……}
    th:value= "${user.name}":将引用user对象的name值。
    2. 文字国际化表达式 #{……}
    3. 选择/星号表达式 *{……}
    4. URL表达式 @{……}
    注意: @{……}支持决定路径和相对路径。其中相对路径又支持跨上下文调用url和协议的引用

    二、 常用的th标签
    简单数据转换(数字,日期)

    <dt>价格</dt>
    <dd th:text="${#numbers.formatDecimal(product.price, 1, 2)}">180</dd>
    <dt>日期</dt>
    <dd th:text="${#dates.format(product.availableFrom, 'yyyy-MM-dd')}">2017-01-01</dd>
    

     字符串拼接

    <dd th:text="${'$'+product.price}">235</dd>
    

     条件判断:不能用”<”,”>”等符号,要用”lt”等替代

    <span th:if="${product.price lt 100}" class="offer">Special offer!</span>
    

     三、 更多Thymeleaf的页面语法,还请访问Thymeleaf的官方文档查询使用

  • 相关阅读:
    JavaScript cookie详解
    Javascript数组的排序:sort()方法和reverse()方法
    javascript中write( ) 和 writeln( )的区别
    div做表格
    JS 盒模型 scrollLeft, scrollWidth, clientWidth, offsetWidth 详解
    Job for phpfpm.service failed because the control process exited with error code. See "systemctl status phpfpm.service" and "journalctl xe" for details.
    orm查询存在价格为空问题
    利用救援模式破解系统密码
    SSH服务拒绝了密码
    C# 调用 C++ DLL 中的委托,引发“对XXX::Invoke类型的已垃圾回收委托进行了回调”错误的解决办法
  • 原文地址:https://www.cnblogs.com/MaxElephant/p/8125394.html
Copyright © 2011-2022 走看看