zoukankan      html  css  js  c++  java
  • Thymeleaf 学习笔记-实例demo(中文教程)

    学习资料网址  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的内容

      
  • 相关阅读:
    使用C#实现DHT磁力搜索的BT种子后端管理程序+数据库设计(开源)
    便携版WinSCP在命令行下同步文件夹
    ffmpeg (ffprobe)分析文件关键帧时间点
    sqlite删除数据或者表后,回收数据库文件大小
    ubuntu 20.04下 freeswitch 配合 fail2ban 防恶意访问
    ffmpeg使用nvenc编码的结论记录
    PC版跑跑卡丁车 故事模式 亚瑟传说章节 卡美洛庆典 2阶段 心灵之眼 攻略
    There was an error loading or playing the video
    Nvidia RTX Voice 启动报错修复方法
    火狐浏览器 关闭跨域限制
  • 原文地址:https://www.cnblogs.com/vinphy/p/4673918.html
Copyright © 2011-2022 走看看