zoukankan      html  css  js  c++  java
  • Thymeleaf 入门

    Thymeleaf是一个表现层的模板引擎,一般被使用在Web环境中。
    Thymeleaf支持多种模板类型:HTML、XML、JavaScript、CSS和普通文本等,默认提供了6种模板处理模式:HTML、XML、TEXT、JAVASCRIPT 、CSS和RAW。最后一个RAW表示不会对模板进行处理。

    开发环境:IntelliJ IDEA 2019.2.2
    Spring Boot版本:2.1.8

    新建一个名称为demo的Spring Boot项目。
    pom.xml加入Thymeleaf依赖:

            <dependency>
                <groupId>org.thymeleaf</groupId>
                <artifactId>thymeleaf</artifactId>
                <version>3.0.11.RELEASE</version>
            </dependency>

    一、处理HTML

    新建一个类HtmlTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    
    public class HtmlTest {
        public static void main(String[] args){
            TemplateEngine templateEngine = new TemplateEngine();
            Context ctx = new Context();
            String html = "<input type='' th:value='lc' />";
            String result = templateEngine.process(html, ctx);
            System.out.println(result);
        }
    }

    右键Run 'XmlTest.main()',控制台输出:

    <input type='' value='lc' />

    根据输出可知,TemplateEngine类会将含有Thymeleaf逻辑的HTML代码转换成纯HTML输出,这就是模板引擎的作用。

    二、更换模板解析器

    默认情况下,模板处理模式为HTML,可以设置不同的解析器。
    新建一个类XmlTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    import org.thymeleaf.templatemode.TemplateMode;
    import org.thymeleaf.templateresolver.StringTemplateResolver;
    
    public class XmlTest {
        public static void main(String[] args){
            TemplateEngine templateEngine = new TemplateEngine();
            //新建模板解析器
            StringTemplateResolver resolver = new StringTemplateResolver();
            //设置模板模式为XML
            resolver.setTemplateMode(TemplateMode.XML);
            //将解析器设置到引擎实例中
            templateEngine.setTemplateResolver(resolver);
            Context ctx = new Context();
            String xml = "<bean id="bean1" th:attr='class=com.example.demo'></bean>";
            String result = templateEngine.process(xml, ctx);
            System.out.println(result);
        }
    }

    右键Run 'HtmlTest.main()',控制台输出:

    <bean id="bean1" class="com.example.demo"></bean>

    三、处理资源文件

    可以为模板引擎设置资源解析器,让它去找文件进行处理。

    1、在src/main/resources下新建文件index.html,只保留下面一行代码

    <input type='' th:value='lc' />

    2、新建一个类 ClassLoaderTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver;
    
    public class ClassLoaderTest {
        public static void main(String[] args) {
            TemplateEngine templateEngine = new TemplateEngine();
            //创建解析器
            ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
            //将解析器设置到引擎实例中
            templateEngine.setTemplateResolver(resolver);
            //处理classpath下的index.html
            String result = templateEngine.process("index.html", new Context());
            System.out.println(result);
        }
    }

    右键Run 'ClassLoaderTest.main()',控制台输出:

    <input type='' value='lc' />

    四、变量处理

    可以通过Context实例设置变量值。

    1、在src/main/resources下新建文件var.html

    <input type='' th:value='${userName}' />

    2、新建一个类 VarTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver;
    
    public class VarTest {
        public static void main(String[] args) {
            TemplateEngine templateEngine = new TemplateEngine();
            ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
            templateEngine.setTemplateResolver(resolver);
            Context ctx = new Context();
            ctx.setVariable("userName", "lc");
            String result = templateEngine.process("var.html", ctx);
            System.out.println(result);
        }
    }

    右键Run 'VarTest.main()',控制台输出:

    <input type='' value='lc' />

    五、遍历集合

    1、在src/main/resources下新建文件iteration.html

    <table>
        <tr th:each="data : ${datas}">
            <td th:text="${data}">姓名</td>
        </tr>
    </table>

    2、新建一个类 IterationTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver;
    
    import java.util.ArrayList;
    import java.util.List;
    
    public class IterationTest {
        public static void main(String[] args) {
            TemplateEngine templateEngine = new TemplateEngine();
            ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
            templateEngine.setTemplateResolver(resolver);
            List<String> datas = new ArrayList<String>();
            datas.add("张三");
            datas.add("李四");
            Context ctx = new Context();
            ctx.setVariable("datas", datas);
            ctx.setVariable("username", "lc");
            String result = templateEngine.process("iteration.html", ctx);
            System.out.println(result);
        }
    }

    右键Run 'IterationTest.main()',控制台输出:

    <table>
        <tr>
            <td>张三</td>
        </tr>
        <tr>
            <td>李四</td>
        </tr>
    </table>

    六、设置前缀与后缀

    1、在src/main/resources/templates下新建文件index.html

    <input type='' th:value='lc' />

    2、新建一个类 PrefixSuffixTest.java

    package com.example.demo;
    
    import org.thymeleaf.TemplateEngine;
    import org.thymeleaf.context.Context;
    import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver;
    
    public class PrefixSuffixTest {
        public static void main(String[] args) {
            TemplateEngine templateEngine = new TemplateEngine();
            ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
            resolver.setPrefix("/templates/");
            resolver.setSuffix(".html");
            templateEngine.setTemplateResolver(resolver);
            String result = templateEngine.process("index", new Context());
            System.out.println(result);
        }
    }

    右键Run 'PrefixSuffixTest.main()',控制台输出:

    <input type='' value='lc' />

    七、Spring Boot中整合Thymeleaf

    1、pom.xml加入Thymeleaf依赖:

            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-starter-thymeleaf</artifactId>
            </dependency>

    2、application.yml
    备注,下面配置的值都为默认值,实际上可不配置。

    spring:
      thymeleaf:
        mode: HTML
        prefix: classpath:/templates/
        suffix: .html

    3、在src/main/resources/templates下新建文件test.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <input type='' th:value='${userName}' />
    </body>
    </html>

    4、新建一个控制器类 DemoController.java

    package com.example.demo;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.RequestMapping;
    
    @Controller
    public class DemoController {
        @RequestMapping("/test")
        public String test(Model model){
            model.addAttribute("userName", "lc");
            return "test";
        }
    }

    运行后,浏览器访问http://localhost:8080/test
    可看到输出结果。

  • 相关阅读:
    bzoj1453
    276D
    855E
    bzoj1458
    树莓派 自启动连接阿里云物联网平台(一)
    树莓派 实现脚本程序自启动
    树莓派4B 系统镜像安装与boot配置
    2019-2020-2《网络对抗技术》 Exp1 PC平台逆向破解
    2019-2020-2 《网络对抗技术》 Exp0 kali 安装
    kali 添加使用 KDE 桌面环境
  • 原文地址:https://www.cnblogs.com/gdjlc/p/11651098.html
Copyright © 2011-2022 走看看