Thymeleaf模板笔记

1、常用标签：

  • 使用thymeleaf模板，首要在html中引入：
<html xmlns:th="http://www.thymeleaf.org">

  • 引入css、js

　　引入css，使用标签th:href="@{路径}"

　　引入js，使用标签th:src="@{路径}"

    <link rel="stylesheet" th:href="@{/static/ace_admin_v1.4.0/assets/css/ace-ie.css}"/>

    <script th:src="@{/static/ace_admin_v1.4.0/assets/js/ace-extra.js}"></script>
  •  th:text 文本替换

　　<p th:text="${collect.description}">description</p>

 

  • th:value 属性赋值

　　<input th:value = "${user.name}" />

  • th:each迭代循环
<tr th:each="user,userStat: ${pageInfo.rows}">
    <td th:text="${userStat.count}"/>
    <td th:text="${user.suName}"/>
    <td th:text="${user.suEmail}"/>
    <td th:text="${user.suPhone}"/>
    <td th:switch="${user.suState}">
        <span th:case="0" class="label label-sm label-warning">未激活</span>
        <span th:case="1" class="label label-sm label-success">已激活</span>
        <span th:case="2" class="label label-sm label-inverse arrowed-in">已注销</span>
    </td>
    <td>
        <div class="hidden-sm hidden-xs action-buttons">
            <a class="green" href="#">
                <i class="ace-icon fa fa-pencil bigger-130"></i>
            </a>

            <a class="red" href="#">
                <i class="ace-icon fa fa-trash-o bigger-130"></i>
            </a>
        </div>
    </td>
</tr>

 

userStat称作状态变量，<td th:text="${userStat.count}"/>代表序号
属性有：

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

  • th:onclick 点击事件，传参

 

th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${index}+'\')'"

 

 

 

2、与Spring MVC集成

  • 引入依赖
    <!--thymeleaf-->
    <!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf -->
    <dependency>
      <groupId>org.thymeleaf</groupId>
      <artifactId>thymeleaf</artifactId>
      <version>${thymeleaf-version}</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf-spring4 -->
    <dependency>
      <groupId>org.thymeleaf</groupId>
      <artifactId>thymeleaf-spring4</artifactId>
      <version>${thymeleaf-version}</version>
    </dependency>

 

  • spring配置文件
    <!-- TemplateResolver <- TemplateEngine <- ViewResolver -->
    <!-- 使用thymeleaf解析，切记要设置编码 -->
    <bean id="templateResolver" class="org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver">
        <property name="prefix" value="/WEB-INF/page/"/>
        <property name="suffix" value=".html"/>
        <property name="templateMode" value="HTML5" />
        <property name="cacheable" value="false"/>
        <!-- 解决中文乱码 -->
        <property name="characterEncoding" value="UTF-8" />
    </bean>
    <!-- Thymeleaf Template Engine (Spring4-specific version) -->
    <bean id="templateEngine" class="org.thymeleaf.spring4.SpringTemplateEngine">
        <property name="templateResolver" ref="templateResolver"/>
    </bean>

    <!-- Thymeleaf View Resolver - implementation of Spring's ViewResolver interface -->
    <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
        <property name="templateEngine" ref="templateEngine" />
        <!-- 解决中文乱码 -->
        <property name="characterEncoding" value="UTF-8" />
    </bean>

 

posted @ 2018-10-02 10:06  纳豆  阅读(204)  评论(0)  编辑  收藏  举报