• SpringMVC整合Thymeleaf


    Thymeleaf的介绍

    进行JavaWeb开发时主要用到的是JSP,传统的JSP需要在页面中加入大量的JSTL标签,这些标签只能运行在服务器中,前端开发人员维护这些页面比较困难,页面加载速度也比较慢。 Thymeleaf是一种全新的页面模板引擎,在Thymeleaf中使用的标签都是基本的HTML标签,可以脱离服务器独立运行,这样前端开发人员可以维护静态页面,后台开发人员将数据绑定上去,利于分工合作,Thymeleaf的语法也比较简洁优雅,比较容易使用。

    SpringMVC整合Thymeleaf

    下面介绍下在SpringMVC框架中如何使用Thymeleaf:<br>

    1. 首先使用Maven导入需要的库:

    <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-context</artifactId>
    <version>4.3.14.RELEASE</version>
    </dependency>
    <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-web</artifactId>
    <version>4.3.14.RELEASE</version>
    </dependency>
    <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-webmvc</artifactId>
    <version>4.3.14.RELEASE</version>
    </dependency>
    <dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf</artifactId>
    <version>3.0.9.RELEASE</version>
    </dependency>
    <dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf-spring4</artifactId>
    <version>3.0.9.RELEASE</version>
    </dependency>

    说明:spring-context、spring-web、spring-webmvc是Spring和SpringMVC的相关库,thymeleaf是Thymeleaf模板库thymeleaf-spring4是Spring整合Thymeleaf所需的库。

    1. 在SpringMVC的配置文件中添加:

    <!--thymeleaf模板解析器-->
    <bean id="templateResolver" class="org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver">
    <!--前缀配置-->
    <property name="prefix" value="/WEB-INF/"></property>
    <!--后缀配置-->
    <property name="suffix" value=".html"></property>
    <!--模板类型-->
    <property name="templateMode" value="HTML"></property>
    <!--不使用缓存-->
    <property name="cacheable" value="false"></property>
    <!--编码类型-->
    <property name="characterEncoding" value="UTF-8"></property>
    </bean>
    <!--模板引擎配置-->
    <bean id="templateEngine" class="org.thymeleaf.spring4.SpringTemplateEngine">
    <property name="templateResolver" ref="templateResolver"></property>
    </bean>
    <!--视图处理器-->
    <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
    <property name="templateEngine" ref="templateEngine"></property>
    <property name="characterEncoding" value="UTF-8"></property>
    </bean>

    1. 添加实体类和Controller类

    //商品类
    public class Goods{
    private int id;
    private String name;
    private double price;
    private String type;
    //setget...
    }
    //商品控制器
    @Controller
    public class GoodsController {

    @RequestMapping("/goods")
    public String test1(Model model){
    //添加
    List<Goods> goods = new ArrayList<>();
    goods.add(new Goods(1,"小米9手机",3999,"数码");
    goods.add(new Goods(2,"小米8手机",2999,"数码");
    goods.add(new Goods(3,"小米7手机",1999,"数码");
    model.addAttribute("goods",goods);
    return "goods";
    }
    }

    1. 编写Thymeleaf页面

    在html标签中加入命名空间:

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

    使用表格显示后台数据:

    <table>
    <tr th:each="g:${goods}">
    <td th:text="${g.id}">1</td>
    <td th:text="${g.name}">牙膏</td>
    <td th:text="${g.price}">200</td>
    <td th:text="${g.type}">100</td>
    </tr>
    </table>

    1. 启动服务器,输入URL后可以看到Thymeleaf将后台数据展示到页面中

    Thymeleaf的属性用法

    前面案例中th:each是将标签进行循环迭代,绑定集合中的数据;th:text是用来绑定每个对象的文本数据。 我们在看看还有哪些常用的属性:

    1、变量,这种写法类似EL表达式和OGNL:
    <h1 th:text="${msg}">Test</h1>
    如果变量是user对象,可以写成:
    <h1 th:text="${user.name}">Test</h1>
    注意:h1标签之间的内容是静态页面显示的,当连接上服务器后会被替换为th:text中的内容。

    2、超链接
    使用th:href标签,内容格式是@{...}
    如:<a href=”index.html” th:href=”@{http://localhost:8080/list(uid=${user.id})}”>测试</a>
    注意:这里list(uid=${user.id})会被替换为list?uid=8类似的格式

    3、文本替换
    <p th:text="'Welcome , ' + ${user.name} + '!'">xxx</p>
    或:
    <p th:text="|Welcome , ${user.name}!|">xxx</p>

    4、运算符 
    Java中的算术运算符、关系运算符、逻辑运算符等都可以使用,
    不过在使用<和>时由于是特殊符号,需要进行转义:
    th:if="${count} &gt; 1"
    th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')"

    5、循环
    th:each=”变量:${集合对象}”
    <table>
    <tr th:each="emp : ${empList}">
    <td th:text="${emp.id}">1</td>
    <td th:text="${emp.name}">张三</td>
    <td th:text="${emp.age}">18</td>
    </tr>
    </table>

    6、条件
    th:if和th:unless,th:if是条件成立是显示标签,th:unless则相反
    下面标签的效果相同,都是当user为空时显示Login超链接
    <a th:href=”@{/login}” th:if=”${user==null}”>Login</a>
    <a th:href=”@{/login}” th:unless=”${user!=null}”>Login</a>

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

    以上就是Thymeleaf的基本用法,可以看到Thymeleaf的用法比较简单,可以很好的代替JSP完成页面开发。

  • 相关阅读:
    nexus2设置开机自启
    谷粒商城XXL-SSO(三十六)
    谷粒商城SpringSession(三十五)
    CDH安装(二)
    CDH安装(一)
    大数据服务规划
    ClouderaManager的背景和介绍
    大数据架构
    C++ const成员变量和成员函数(常成员函数)
    C++ this指针详解(精辟)
  • 原文地址:https://www.cnblogs.com/qfchen/p/10637526.html
Copyright © 2020-2023  润新知