Thymeleaf(视图模板技术)

发表于 更新于 分类于 阅读次数： Valine：

Thymeleaf的使用

Thymelaef帮助我们将数据与与html进行结合，渲染到界面上

image-20220402164624274

image-20220404092102023

要将这些水果以list的方式渲染到界面上

使用步骤

导入jar包

image-20220404100437899

写入方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
package com.zss.servlets;

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

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * @author zss
 */
public class ViewBaseServlet extends HttpServlet {

    private TemplateEngine templateEngine;

    @Override
    public void init() throws ServletException {

        // 1.获取ServletContext对象
        ServletContext servletContext = this.getServletContext();

        // 2.创建Thymeleaf解析器对象
        ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver(servletContext);

        // 3.给解析器对象设置参数
        // ①HTML是默认模式，明确设置是为了代码更容易理解
        templateResolver.setTemplateMode(TemplateMode.HTML);

        // ②设置前缀
        String viewPrefix = servletContext.getInitParameter("view-prefix");

        templateResolver.setPrefix(viewPrefix);

        // ③设置后缀
        String viewSuffix = servletContext.getInitParameter("view-suffix");

        templateResolver.setSuffix(viewSuffix);

        // ④设置缓存过期时间（毫秒）
        templateResolver.setCacheTTLMs(60000L);

        // ⑤设置是否缓存
        templateResolver.setCacheable(true);

        // ⑥设置服务器端编码方式
        templateResolver.setCharacterEncoding("utf-8");

        // 4.创建模板引擎对象
        templateEngine = new TemplateEngine();

        // 5.给模板引擎对象设置模板解析器
        templateEngine.setTemplateResolver(templateResolver);

    }

    protected void processTemplate(String templateName, HttpServletRequest req, HttpServletResponse resp) throws IOException {
        // 1.设置响应体内容类型和字符集
        resp.setContentType("text/html;charset=UTF-8");

        // 2.创建WebContext对象
        WebContext webContext = new WebContext(req, resp, getServletContext());

        // 3.处理模板数据
        templateEngine.process(templateName, webContext, resp.getWriter());
    }
}

在web.xml中添加配置

下面中的param-name分别配置上下文参数，而其分别对应ViewBaseServlet的对应的上下文参数

1
2
3
4
5
6
7
8
9
<!-- 在上下文参数中配置视图前缀和视图后缀 -->
<context-param>
    <param-name>view-prefix</param-name>
    <param-value>/</param-value>
</context-param>
<context-param>
    <param-name>view-suffix</param-name>
    <param-value>.html</param-value>
</context-param>

继承ViewBaseServlet

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
package com.zss.servlets;

import com.zss.impl.FruitDAOImpl;
import com.zss.object.Fruit;

import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.List;

public class InquireFruitServlet extends ViewBaseServlet {
    @Override
    public void doPost(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        req.setCharacterEncoding("UTF-8");
        FruitDAOImpl fruitDAO=new FruitDAOImpl();
        List<Fruit> list=fruitDAO.inquFruit(new Fruit());
        //将变量临时保存到内存中
        HttpSession session=req.getSession();
        session.setAttribute("fruitList",list);
        for (int i=0;i<list.size();i++){
            System.out.println(list.get(i));
        }
        //会将此处的视图名称对应到物理名称
        //逻辑视图名称 Fruitshow
        //物理视图名称 =前文+逻辑视图名称+后文=/show/Fruitshow.html
        super.processTemplate("show/FruitShow",req,resp);
    }

 }

进行判断，添加对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!--先判断是否为空-->
<tr th:if="${#lists.isEmpty(session.fruitList)}" >
    <td colspan="4">对不起，库存为空</td>
</tr>
<!--循环一次，就将session中的数据带入-->
<tr th:unless="${#lists.isEmpty(session.fruitList)}" th:each="fruit : ${session.fruitList}">
    <td th:text="${fruit.fid}">1</td>
    <td th:text="${fruit.fname}">苹果</td>
    <td th:text="${fruit.price}">5</td>
    <td th:text="${fruit.fcount}">20</td>
    <td th:text="${fruit.remark}">无</td>
    <td>100</td>
    <td>×</td>
</tr>
<tr >