thymeleaf

thymeleaf 专栏收录该内容
1 篇文章 0 订阅

     最近在学习thymeleaf, thymeleaf是一种前端模板,跟freemarker和volecity一样,但我在网上查很少有关于它的资料,不知道是为什么。今天在MyEclipse中首次使用了一把thymeleaf。它与freemarker和volecity相比的优势是它是一种自然的模板(官方文档是这么称呼的),自然模板就是页面的显示与要展示的数据是完全分离的。即使单独的运行html文件也是可行的,只不过这时候显示的数据是你设置的默认数据。当和真正要展示的数据结合起来时,真实的数据就会替换掉默认的数据。

   自己写的测试例子很简单,浏览器请求一个servlet,在servlet中调用thymeleaf的API选择模板,解析模板。

目录结构如下图:

   在Referenced Libraries包中,前三个是thymeleaf的jar包,后四个是thymeleaf依赖的jar包,都要添加到路径上。值得注意的是在模板home.html文件中如果使用thymeleaf中的#{...}表达式,需要在相同路径下,以相同的名字创建一个properties文件。

   home.html文件的内容是:

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html>
  <head	xmlns="http://www.w3.org/1999/xhtml"
		xmlns:th="http://www.thymeleaf.org">
    <title>Good Thymes Virtual Grocery</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    
  </head>
  
  <body>
  
	<p th:text="${name}">李四</p>
  </body>
</html>

    需要注意第一行要加入thymeleaf的dtd文件声明。其实不加也行,只是为了更规范。另外在head标签中要加入命名空间。单独运行这个html文件就会显示的是“李四”。

   servlet的代码是:

package com.zhang.controller;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.thymeleaf.TemplateEngine;
import org.thymeleaf.context.WebContext;
import org.thymeleaf.templateresolver.ServletContextTemplateResolver;

public class TestThy extends HttpServlet {


	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		process(request,response,this.getServletContext());
	}


	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		doGet(request,response);
	}

	public void process(HttpServletRequest request, HttpServletResponse response,
			ServletContext servletContext) throws IOException{
		WebContext ctx = new WebContext(request, response, servletContext, request.getLocale());
		ctx.setVariable("name", "张三");
		TemplateEngine templateEngine = new TemplateEngine();
		ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver();
		templateResolver.setTemplateMode("XHTML");
		templateResolver.setPrefix("/templates/");
		templateResolver.setSuffix(".html");
		templateResolver.setCharacterEncoding("utf-8");
		templateEngine.setTemplateResolver(templateResolver);
		response.setCharacterEncoding("utf-8");
		templateEngine.process("home", ctx, response.getWriter());
	}
}
    这次运行的话,home页面上显示的就是“张三”了。具体的语句是什么意思,在官方文档中都能查到。要说的一点是中文乱码的问题。在代码中如果不加倒数第二行代码,那么在home页面中显示的就是乱码。
    忘了说一点,在测试的时候不要用MyEclipse内嵌的浏览器,因为我发现有页面缓存的问题,及时你不设置缓存,非要刷新一下才能显示正确的结果

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值