美文网首页
[Spring Boot]使用Thymeleaf3

[Spring Boot]使用Thymeleaf3

作者: kun1988 | 来源:发表于2016-11-18 21:17 被阅读0次
  • gradle配置
    不需要配置spring boot默认的
compile('org.springframework.boot:spring-boot-starter-thymeleaf')

只需要添加

compile("org.thymeleaf:thymeleaf:3.0.2.RELEASE")
compile("org.thymeleaf:thymeleaf-spring4:3.0.2.RELEASE")
compile("nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect:2.1.1")
  • maven配置
    这个就更简单了,添加spring-boot-starter-thymeleaf,然后再配置版本号
<properties>
    <thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
    <thymeleaf-layout-dialect.version>2.0.4</thymeleaf-layout-dialect.version>
</properties>
使用Thymeleaf3的新功能css和js模板

import org.springframework.beans.BeansException;
import org.springframework.context.ApplicationContext;
import org.springframework.context.ApplicationContextAware;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.ViewResolver;
import org.thymeleaf.TemplateEngine;
import org.thymeleaf.spring4.SpringTemplateEngine;
import org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver;
import org.thymeleaf.spring4.view.ThymeleafViewResolver;
import org.thymeleaf.templateresolver.ITemplateResolver;
import org.thymeleaf.templatemode.*;


@Configuration
public class ThymeleafConfig implements ApplicationContextAware{
    private static final String UTF8 = "UTF-8";
    private ApplicationContext applicationContext;

    private String[] array(String ...args) {
        return args;
    }

    @Override
    public void setApplicationContext(ApplicationContext applicationContext) throws BeansException {
        this.applicationContext = applicationContext;
    }

    private TemplateEngine templateEngine(ITemplateResolver templateResolver) {
        SpringTemplateEngine engine = new SpringTemplateEngine();
        engine.setTemplateResolver(templateResolver);
        return engine;
    }

    private ITemplateResolver htmlTemplateResolver() {
        SpringResourceTemplateResolver resolver = new SpringResourceTemplateResolver();
        resolver.setApplicationContext(applicationContext);
        resolver.setPrefix("classpath:/templates/");
        resolver.setTemplateMode(TemplateMode.HTML);
        return resolver;
    }

    @Bean
    public ViewResolver htmlViewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine(htmlTemplateResolver()));
        resolver.setContentType("text/html");
        resolver.setCharacterEncoding(UTF8);
        resolver.setViewNames(array("*.html"));
        resolver.setCache(false);
        return resolver;
    }

    private ITemplateResolver cssTemplateResolver() {
        SpringResourceTemplateResolver resolver = new SpringResourceTemplateResolver();
        resolver.setApplicationContext(applicationContext);
        resolver.setPrefix("classpath:/templates/");
        resolver.setTemplateMode(TemplateMode.CSS);
        return resolver;
    }

    @Bean
    public ViewResolver cssViewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine(cssTemplateResolver()));
        resolver.setContentType("text/css");
        resolver.setCharacterEncoding(UTF8);
        resolver.setViewNames(array("*.css"));
        resolver.setCache(false);
        return resolver;
    }

    private ITemplateResolver javascriptTemplateResolver() {
        SpringResourceTemplateResolver resolver = new SpringResourceTemplateResolver();
        resolver.setApplicationContext(applicationContext);
        resolver.setPrefix("classpath:/templates/");
        resolver.setTemplateMode(TemplateMode.JAVASCRIPT);
        return resolver;
    }

    @Bean
    public ViewResolver javascriptViewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine(javascriptTemplateResolver()));
        resolver.setContentType("application/javascript");
        resolver.setCharacterEncoding(UTF8);
        resolver.setViewNames(array("*.js"));
        resolver.setCache(false);
        return resolver;
    }
}

上面直接提供了现成的代码,然后再yml文件里面把缓存和默认的thymeleaf关了

spring:
  thymeleaf:
    cache: false
    enabled: false

完成了。下面给一个示例:
resources/templates/index.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      >
  <head>
    <title>Thymeleaf 3 example</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="main.css">
    <script src="common.js" ></script>
  </head>
  <body>
    <h1>User hobbies</h1>
    <ul>
      <li th:each="hobby : ${hobbies}"
          th:text="${hobby}">
        Cinema
      </li>
    </ul>
  <button type="button" onclick="showCode()">Show secret code</button>
  <div id="code"></div>
  </body>
</html>

resources/templates/main.css

body {
    font-family: Arial, sans-serif;
    padding-left: 1em;
    background-color: /*[[${backgroundColor}]]*/ pink;
}

resources/templates/common.js

function showCode() {
    var code = /*[[${code}]]*/ '12345';
    document.getElementById('code').innerHTML = code;
}

相关文章

网友评论

      本文标题:[Spring Boot]使用Thymeleaf3

      本文链接:https://www.haomeiwen.com/subject/gxespttx.html