一、前言

  • 为什么要使用模板页(Layout)

网站中往往有通用的布局,比如导航、底部等等,这些页面中共用的部分,就需要放在母版页(Layout)里面。
这样每个页面只用关注本页面要完成的功能/内容即可。提高了开发效率,也降低了公共部分的维护成本。

如果你还未使用过Thymeleaf,可以先阅读:使用Spring Boot+Thymeleaf模板引擎开发Web应用

二、实现方式

  • 母版页代码(resources/templates/shared/layout1.html)
<!DOCTYPE html>
<html lang="en">
<head>
    <title th:text="${title}"></title>
</head>
<body>
<div layout:fragment="content">
    默认内容
</div>
</body>
</html>
  • 子页面代码(resources/templates/demo/page1.html)
<div layout:decorator="shared/layout1">
    <div layout:fragment="content">
        page1子页面内容
    </div>
</div>

语法/标签说明

语法/标签 说明
layout:fragment 定义模板片段,可以在子页面用同名片段覆盖
layout:decorator 引用Thymeleaf页面作为母版/模板
  • 控制器函数
@RequestMapping("/page1")
ModelAndView page1(){
    ModelAndView modelAndView=new ModelAndView();
    modelAndView.addObject("title","page1页面标题");
    modelAndView.setViewName("demo/page1");
    return modelAndView;
}

最终的渲染结果是:


<!DOCTYPE html>
<html>
<head>
    <title>page1页面标题</title>
</head>
<body>
    <div>
        page1子页面内容
    </div>
</body>
</html>