Thymeleaf 学习笔记-实例demo(中文教程)

时间:2022-08-25 16:04:44
学习资料网址  http://www.blogjava.net/bjwulin/archive/2013/02/07/395234.html (不做浮躁的人)博文
        http://www.blogjava.net/bjwulin/archive/2014/02/11/409734.html (不做浮躁的人)博文<与spring整合>
                   http://www.tuicool.com/articles/yYZbIrB 基本知识
                   http://itutorial.thymeleaf.org/  官方演示
                   http://www.cnblogs.com/vinphy/p/4673918.html 本文地址
 
springMVC + thymeleaf demo步骤:
1.建一个springMVC项目
2.加jar包
3.在web.xml中配置servlet
4.在配置的servlet.xml文件夹里配置thymeleaf相关配置
5.在cotroller中定义入口控制
6.将静态页面加入项目中,并添加thymeleaf标签
7.部署访问
 
--系统 Windows7
--开发工具 intelliJ idea
--项目管理工具 maven
--自动化构建工具 gradle
--模板 thymeleaf
--框架 springMVC
1.建一个springMVC项目
  用intelliJ 新建一个springMVC项目 参见http://note.youdao.com/share/?id=89349b4e4f6f57ae603c2c43bad1bb62&type=note
 
2.加jar包
    1)gradle加jar包
compile("org.springframework.boot:spring-boot-starter-thymeleaf")
    2)jar包下载地址
 
3.在web.xml中配置servlet
  
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
version="3.0">
<!--配置WEB-INF下的servlet-context.xml文件-->
<servlet>
<servlet-name>appServlet</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/servlet-context.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>appServlet</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
</web-app>
4.在配置的servlet.xml文件夹里配置thymeleaf相关配置
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd
http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd">
<!-- Scans the classpath of this application for @Components to deploy as beans -->
<context:component-scan base-package="com.test.thymeleaf.controller" />
<!-- Configures the @Controller programming model -->
<mvc:annotation-driven />
<!--Resolves view names to protected .jsp resources within the /WEB-INF/views directory -->
<!--springMVC+jsp的跳转页面配置-->
<!--<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">-->
<!--<property name="prefix" value="/WEB-INF/views/" />-->
<!--<property name="suffix" value=".jsp" />-->
<!--</bean>-->
<!--springMVC+thymeleaf的跳转页面配置-->
<bean id="templateResolver"
class="org.thymeleaf.templateresolver.ServletContextTemplateResolver">
<property name="prefix" value="/WEB-INF/views/" />
<property name="suffix" value=".html" />
<property name="templateMode" value="HTML5" />
</bean> <bean id="templateEngine"
class="org.thymeleaf.spring4.SpringTemplateEngine">
<property name="templateResolver" ref="templateResolver" />
</bean> <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
<property name="templateEngine" ref="templateEngine" />
</bean>
</beans>
5.在cotroller中定义入口控制
package com.test.thymeleaf.controller;
import com.test.thymeleaf.domain.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod; @Controller
public class HomeController {
User user = new User();
//入口
@RequestMapping(value = "/home")
public String home(Model model) {
model.addAttribute("user",user);
return "aa";
}

  //提交表单后进行数据读取,并将数据传出
@RequestMapping(value = "/bb",method = RequestMethod.POST)
public String bb(User user,Model model) {
model.addAttribute("user", user);
model.addAttribute("message", ",welcome");
return "bb";
}
}
6.将静态页面加入项目中,并添加thymeleaf标签
  注意头文件
  
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
 
 aa.html(用th:object定义表单数据提交对象,用th:field定义表单数据属性,用*{}锁定上级定义的对象,{}内填写对象属性,提交表单时自动降属性值封住到对象中)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"> <head>
<title>Home</title>
</head>
<body>
<form th:action="@{/bb}" th:object="${user}" th:method="post"> <input type="text" th:field="*{name}"/>
<input type="text" th:field="*{msg}"/> <input type="submit"/>
</form> </body>
</html>

 bb.html(用${}读取后台传出的数据动态替换静态数据“vinphy,”和"welcome!")

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"> <head>
<meta charset="utf-8"/>
<title>Home</title>
</head>
<body>
<div>
<sapn th:text="${user.name}">vinphy,</sapn>
<sapn th:text="${message}">welcome!</sapn>
</div>
</body>
</html>

7.部署访问

部署后访问http://localhost:8080/home进行访问,出现aa.html的内容

  Thymeleaf 学习笔记-实例demo(中文教程)Thymeleaf 学习笔记-实例demo(中文教程)Thymeleaf 学习笔记-实例demo(中文教程)

Thymeleaf 学习笔记-实例demo(中文教程)的更多相关文章

  1. thymeleaf 学习笔记-基础篇&lpar;中文教程&rpar;

    (一)Thymeleaf 是个什么?      简单说, Thymeleaf 是一个跟 Velocity.FreeMarker 类似的模板引擎,它可以完全替代 JSP .相较与其他的模板引擎,它有如下 ...

  2. 学习笔记《简明python教程》

    学习笔记<简明python教程> 体会:言简意赅,很适合新手入门 2018年3月14日21:45:59 1.global 语句 在不使用 global 语句的情况下,不可能为一个定义于函数 ...

  3. CUBRID学习笔记 1 简介 cubrid教程

    CUBRID 是一个全面开源,且完全免费的关系数据库管理系统.CUBRID为高效执行Web应用进行了高度优化,特别是需要处理大数据量和高并发请求的复杂商务服务.通过提供独特的最优化特性,CUBRID可 ...

  4. 【Microsoft Azure学习之旅】消息服务Service Bus的学习笔记及Demo示例

    今年项目组做的是Cloud产品,有幸接触到了云计算的知识,也了解并使用了当今流行的云计算平台Amazon AWS与Microsoft Azure.我们的产品最初只部署在AWS平台上,现在产品决定同时支 ...

  5. 学习笔记之Python 3 教程

    Python 3 教程 http://www.runoob.com/python3/python3-tutorial.html Python的3.0版本,常被称为Python 3000,或简称Py3k ...

  6. Android(java)学习笔记212:中文乱码的问题处理(qq登录案例)

    1.我们在之前的笔记中LoginServlet.java中,我们Tomcat服务器回复给客户端的数据是英文的"Login Success","Login Failed&q ...

  7. Android(java)学习笔记155:中文乱码的问题处理(qq登录案例)

    1. 我们在之前的笔记中LoginServlet.java中,我们Tomcat服务器回复给客户端的数据是英文的"Login Success","Login Failed& ...

  8. 学习笔记:yaml语言教程

    目录 1.YAML基本概念 1.1 简介 1.2 基本语法 1.3 支持的数据结构: 1.4 注意点 2.数据结构 2.1 字典 2.2 数组 2.3 纯量 2.4 强制类型转换,双! 2.5 字符串 ...

  9. JavaScript学习笔记-实例详解-类(二)

    实例详解-类(二)   //===给Object.prototype添加只读\不可枚举\不可配置的属性objectId(function(){ Object.defineProperty(Object ...

随机推荐

  1. 关于Lucene&period;net 中高亮显示关键词的深究

    这几天一直在学习lucene,也写了3篇自己总结的知识点,本以为很容易上手的东西,但是却遇到了一个很棘手的问题,借此,希望可以跟大家探讨一下 问题:使用盘古高亮显示组件后,如搜索“mp3 player ...

  2. 使用国内 maven 镜像 代替国外 mirror

    使用maven的都知道国外的maven下载一个是比较慢,一个是因为被墙,一些jar包无法下载,非常老火. 比如出现类似下面的错误: Unknown host repo.maven.apache.org ...

  3. (转,有改动)测试网页响应时间的shell脚本&lbrack;需要curl支持&rsqb;

    用法及返回结果如下: [root@myserver01 tmp]# sh test_web.sh -n500 http://www.baidu.com Request url: http://www. ...

  4. BootStrap简介及应用要点

    BootStrap简介 BootStrap是基于HTML.CSS和JavaScript的框架,使你只需要写简单的代码就可以很快的搭建一个还不错的前端框架,他是后端程序员的福音,使他们只需要专注业务逻辑 ...

  5. Jquery选择器 讲解

    在Dom 编程中我们只能使用有限的函数根据id 或者TagName 获取Dom 对象. 然而在jQuery 中则完全不同,jQuery 提供了异常强大的选择器用来帮助我们获取页面上的对象, 并且将对象 ...

  6. JAVA笔记1-00

    package chapter1; public class Demo1 { public static void main(String[] args) { System.out.println(& ...

  7. XCL-Charts画一个图&lpar;CurveChart&rpar;

    情节线图与往常不同的是,它是一个比较特殊线位置计算.所以我得到一个单独的类.相同.只需要输入数据源的基类, 加,控制要添加的.你可以画出你自己主动设置按照预期的效果. 代码: //图基类 chart ...

  8. ReactJS antd 环境中项目上传图片后压缩(lrz的使用)

    lrz说明 ( github地址 :https://github.com/think2011/localResizeIMG ) 用于:在客户端压缩好要上传的图片可以节省带宽更快的发送给后端,特别适合在 ...

  9. 北大poj-1021

    2D-Nim Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 4066   Accepted: 1851 Descriptio ...

  10. HTTP response 添加body

    在拦截器中进行拦截操作时,想要给response添加body,如何操作? /** * 返回JSON数据 * @param response * @param obj * @throws Excepti ...