1. 程式人生 > 實用技巧 >thymeleaf的手動渲染HTML模板

thymeleaf的手動渲染HTML模板

thymeleaf的手動渲染HTML模板

2018-11-14 11:18:106833收藏2 分類專欄:Springboot 版權

現在很多公司都在thymeleaf作為前端的顯示,但是剛看了一份部落格,現在還有人在不斷的詬病thymeleaf的效能問題,然後聽說了一個超級牛逼的叫beetl.其實就是下面這個部落格

https://my.oschina.net/xiandafu/blog/1505526?p=4

,然後看了看這個Beetl的東西,感覺確實很牛逼啊,但是不在今天的部落格範圍內,以後有機會可以試試,為什麼我不寫freemaker,因為我覺得語法太噁心,想當年,唉,真是往事不堪回首啊,我現在還覺得freemaker的語法噁心.....

言歸正傳:下面我們來手動渲染一段html程式碼和一個html頁面

新增依賴:

  1. <!-- Thymeleaf 模板引擎 -->
  2. <dependency>
  3. <groupId>org.thymeleaf</groupId>
  4. <artifactId>thymeleaf</artifactId>
  5. <version>3.0.9.RELEASE</version>
  6. </dependency>

1.封裝一個渲染的工具類:

  1. import org.thymeleaf.TemplateEngine;
  2. import org.thymeleaf.context.Context;
  3. import java.util.Map;
  4. /**
  5. * @author zk
  6. * @Description:
  7. * @date 2018-11-14 10:34
  8. */
  9. public class HTMLTemplateUtils {
  10. private final static TemplateEngine engine=new TemplateEngine();
  11. /**
  12. * 使用 Thymeleaf 渲染 HTML
  13. * @param template HTML模板
  14. * @param params 引數
  15. * @return 渲染後的HTML
  16. */
  17. public static String render(String template,Map<String,Object> params){
  18. Context context = new Context();
  19. context.setVariables(params);
  20. return engine.process(template,context);
  21. }
  22. }

2.測試:

  1. public class Test {
  2. public static void main(String[] args) {
  3. String template = "<p th:text='${title}'></p>";
  4. HashMap<String, Object> map = new HashMap<>();
  5. map.put("title","hello world");
  6. String render = HTMLTemplateUtils.render(template, map);
  7. System.out.println("渲染之後的字串是:"+render);
  8. }
  9. }

這裡執行後會輸出:渲染之後的字串是:<p>hello world</p>

達到了我們想要的渲染的效果,其實就是一個字串的替換.....

下面我們渲染一個html檔案.準備一個 example.html 放在resources下面

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <h1 th:text="${name}">列表名稱</h1>
  9. <ul>
  10. <li th:each="item: ${array}" th:text="${item}">條目</li>
  11. </ul>
  12. </body>
  13. </html>

寫一個測試的類:

  1. public class HTMLTest2 {
  2. public static void main(String[] args) throws IOException {
  3. ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
  4. //模板所在目錄,相對於當前classloader的classpath。
  5. resolver.setPrefix("");
  6. //模板檔案字尾
  7. resolver.setSuffix(".html");
  8. TemplateEngine engine = new TemplateEngine();
  9. engine.setTemplateResolver(resolver);
  10. //構造上下文(Model)
  11. Context context = new Context();
  12. context.setVariable("name", "三國人物");
  13. context.setVariable("array", new String[]{"曹操", "劉備", "孫權", "漢獻帝"});
  14. //渲染模板
  15. FileWriter writer = new FileWriter("result.html");
  16. engine.process("example",context,writer);
  17. //這個example.html 放在resources 下面.這樣機會生成一個result.html檔案,結果都已經放進去了.
  18. }
  19. }

我們這裡把渲染後的結果到result.html 中

執行程式就會生成一個result.html 內容是:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <h1>三國人物</h1>
  9. <ul>
  10. <li>曹操</li>
  11. <li>劉備</li>
  12. <li>孫權</li>
  13. <li>漢獻帝</li>
  14. </ul>
  15. </body>
  16. </html>

也可以手動的渲染web請求來的,下次咱們再補充上來.敬請期待

其實渲染最後都是呼叫的這個方法:

/**
 * org.thymeleaf.templateparser.ITemplateParser#parseStandalone(org.thymeleaf.IEngineConfiguration, java.lang.String, java.lang.String, java.util.Set, org.thymeleaf.templateresource.ITemplateResource, org.thymeleaf.templatemode.TemplateMode, boolean, org.thymeleaf.engine.ITemplateHandler)
 */