掌握FreeMarker模板继承：提升代码复用性

提示信息

颤动

10月25日发表在 FreeMarker Java模板引擎阅读 15 评论 20 | 免费使用 “AI大模型GPT4.0” 提问

FreeMarker是一种成熟的Java模板引擎，旨在通过模板化的方式生成文本输出，例如HTML、电子邮件、配置文件等。模板继承是提高代码复用性和维护性的有效手段之一，虽然FreeMarker本身不直接支持类似于某些MVC框架中的模板继承，但我们可以通过一些技巧来实现类似的效果。

以下是如何在FreeMarker中实现模板继承的几种方法：

1. 使用宏（macro）

FreeMarker宏类似于函数，可以在模板中定义一段可重用的代码。通过宏，我们可以定义通用的结构，然后在其他模板中调用。

定义宏

在一个模板中定义宏：

<#macro header>  
    <header>  
        <h1>My Website</h1>  
    </header>  
</#macro>  
<#macro footer>  
    <footer>  
        <p>© 2023 My Website</p>  
    </footer>  
</#macro>

使用宏

在其他模板中调用这些宏：

<#include "common.ftl">  
<html>  
    <body>  
        <@header/>  
        <div>  
            <p>Welcome to my website!</p>  
        </div>  
        <@footer/>  
    </body>  
</html>

2. 使用<#include>指令

通过<#include>指令，可以将一个模板的内容插入到另一个模板中，从而实现模块化设计。

声明包含文件

header.ftl

<header>  
    <h1>My Website</h1>  
</header>

footer.ftl

<footer>  
    <p>© 2023 My Website</p>  
</footer>

包含文件

在主模板中包含这些文件：

<html>  
    <body>  
        <#include "header.ftl"/>  
        <div>  
            <p>Welcome to my website!</p>  
        </div>  
        <#include "footer.ftl"/>  
    </body>  
</html>

3. 使用占位符和布局模板

通过定义带占位符的布局模板，可以实现类似于继承的效果。

定义布局模板

layout.ftl

<html>  
    <body>  
        <#include "header.ftl"/>  
        ${content}  
        <#include "footer.ftl"/>  
    </body>  
</html>

使用布局模板

子模板使用main内容传递内容：

<#assign content>  
<div>  
    <p>Welcome to my website!</p>  
</div>  
</#assign>  
<#include "layout.ftl"/>

总结

尽管FreeMarker不像一些其他模板引擎那样提供直接的模板继承机制，但通过使用宏、包含文件和布局模板，我们可以实现灵活且高效的代码复用和布局管理。这些技巧不仅能帮助我们保持代码的干净和模块化，同时也易于扩展和维护。

遇到难题？ "AI大模型GPT4.0、GPT" 是你的私人解答专家！点击按钮去提问......

颤动赞 | 0

最近一次登录：2024-11-20 12:13:14

暂时还没有签名，请关注我或评论我的文章

20条评论

按时间正序按时间倒序按喜欢排序

温瞳

10月29日

宏的使用真是个好主意，尤其在构建共享部分时。可以通过编写宏像这样： <#macro button label> <button>${label}</button> </#macro>这样简单的复用能大大提高代码的整洁度。

赞 0 回复举报

尘土飞扬： @温瞳

很赞同使用宏来提升代码的复用性，这在构建大型应用时尤其重要。除了创建按钮宏，还可以考虑添加一些样式参数，以便更灵活地控制元素的外观。例如，可以扩展你的按钮宏来接受样式参数：

<#macro button label style="">
    <button class="${style}">${label}</button>
</#macro>

这样调用时就能根据需要应用不同的样式：

<button label="提交" style="btn-primary" />
<button label="取消" style="btn-secondary" />

在使用继承的同时，宏能更好地符合DRY（Don't Repeat Yourself）原则，使得代码更加简洁和易于维护。可以试着在官方文档查看更多关于宏的使用示例和技巧：FreeMarker Documentation。使用得当，确实能让模板的编写变得更加高效和整洁。

5天前回复举报

添加新评论

雅雯

11月01日

使用<#include>指令让模板组织结构变得清晰，尤其是在响应式设计中。以下是个简单示例：

<#include "header.ftl"/>
<div>内容区域</div>
<#include "footer.ftl"/>

赞 0 回复举报

安于： @雅雯

在提到使用 <#include> 指令来清晰地组织模板结构时，确实是一个有效的方式。在响应式设计中，分离头部、内容和脚部的确能够提升代码的可维护性和可复用性。在此基础上，使用模板继承能进一步简化逻辑和提升灵活性。

可以考虑结合使用 <#include> 和继承方法，定义一个基础模板，例如：

<#-- base.ftl -->
<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
    <#include "header.ftl"/>
    <div>
        <#block content>
        <#-- Content will be replaced in child templates -->
        </#block>
    </div>
    <#include "footer.ftl"/>
</body>
</html>

然后在子模板中继承和覆盖 content 块：

<#-- page.ftl -->
<#include "base.ftl">
<#macro content>
    <h1>欢迎访问</h1>
    <p>这是内容区域。</p>
</#macro>

这样的方式可使得不同页面具有统一的结构，同时只需关注特定内容的实现，进一步提升了代码复用性。

更多关于 FreeMarker 模板的灵活用法，可以参考：FreeMarker Documentation。

11月14日回复举报

添加新评论

擦肩而过

11月04日

很多项目都需要共用header与footer，<#include>的确是个很好的选择。借助它，多个页面都能快速获取相同的样式和结构。

赞 0 回复举报

心动： @擦肩而过

在实现模板的复用时，确实可以通过<#include>指令来轻松共享header和footer。不过，在复杂的项目中，模板继承可能提供更灵活的结构。通过定义基础模板，子模板可以自动继承并覆盖所需的部分，能有效提高代码的可读性和维护性。

以下是一个简单的示例，展示如何使用FreeMarker的模板继承：

<!-- base.ftl -->
<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
</head>
<body>
    <#include "header.ftl">

    <#block content>
        Default content goes here.
    </#block>

    <#include "footer.ftl">
</body>
</html>

<!-- child.ftl -->
<#extends "base.ftl">

<#block content>
    <h1>Welcome to My Website!</h1>
    <p>This is the custom content for the child template.</p>
</#block>

通过这种方式，不仅能够共享公共结构，还可以自定义每个页面的内容。此外，了解如何结合使用<#include>与模板继承将更加提升代码复用性。可以参考 FreeMarker的官方文档来获得更多关于模板功能的信息。

11月14日回复举报

添加新评论

丝丝

6天前

通过占位符设计布局模板真是太棒了，维护起来也方便。示例代码： ``` <#assign content="

我的内容

"/> <#include "layout.ftl"/> ```这样可以集中更新布局，保持一致性。

赞 0 回复举报

现实： @丝丝

使用占位符设计布局模板的思路很有意义，能够显著提升代码的可维护性。在FreeMarker中，采用模板继承的方式来实现复杂的布局也是一种常见的做法。例如，可以通过定义一个基布局模板，然后在各个子模板中包含它，以确保所有页面都遵循同样的样式。这种方法使得任何更新都只需在一个地方进行，降低了出错的概率。

下面是一个简单的示例，展示了如何使用FreeMarker模板继承：

layout.ftl:

<!DOCTYPE html>
<html>
<head>
    <title><#block title>默认标题</#block></title>
</head>
<body>
    <header>
        <h1><#block header>欢迎使用我的网站</#block></h1>
    </header>
    <main>
        <#block content>默认内容</#block>
    </main>
    <footer>
        <p>版权所有 © 2023</p>
    </footer>
</body>
</html>

content.ftl:

<#import "layout.ftl" as layout>

<#macro render>
    <#assign content="这里是具体内容"/>
    <#include "layout.ftl"/>
</#macro>

<@render/>

通过使用这样的结构，任何时候需要更新布局，或者改变某部分内容时，只需修改对应的模板，其他地方将自动应用这些更改。

可以参考以下网址获取更多关于FreeMarker模板继承的资料：FreeMarker Documentation。这种灵活的布局设计显然是构建健壮的Web应用的关键策略之一。

昨天回复举报

添加新评论

jwj_789456

5天前

将布局和内容分离能让代码更加模块化，layout.ftl的设计使得更换网站模板变得容易，体验更加友好。

赞 0 回复举报

无双未央： @jwj_789456

分离布局与内容的确能显著提升代码的模块化程度。在使用 FreeMarker 进行模板继承时，合理设计 layout.ftl 文件不仅能简化模板的维护，还能加快模板更新的速度。比如，下面的代码展示了一个基本的 layout.ftl 示例，它为各个页面提供了统一的框架：

<#-- layout.ftl -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>${title}</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <h1>${header}</h1>
    </header>
    <main>
        <#nested/>
    </main>
    <footer>
        <p>&copy; 2023 My Website</p>
    </footer>
</body>
</html>

在具体的页面模板中，只需简单地引用这个布局并定义内容：

<#-- index.ftl -->
<#assign title = "首页">
<#assign header = "欢迎来到我的网站">
<#include "layout.ftl">

使用这种方法，即使要更换整个网站的主题，仅需调整 layout.ftl，内容模板不需要大动干戈。来了解更多关于 FreeMarker 模板继承的奥秘，这里有个不错的参考：FreeMarker Tutorial。这种方法不仅提升了代码的重用性，也让团队协作变得更加高效。

3天前回复举报

添加新评论

安然浅眠

10小时前

对于处理大型项目来说，使用宏和包含文件的组合能大幅缩减重复代码，提高开发效率，令团队协作也更流畅。

赞 0 回复举报

柔素年： @安然浅眠

在大型项目中，结合使用FreeMarker的宏和包含文件确实是提高代码复用性的重要方法。这种方式不仅能有效减少重复代码，还能让团队成员更容易理解和维护模板。

例如，通过定义一个通用的页面头部宏，可以在多处引入，避免重复代码：

<#macro commonHeader title>
  <header>
    <h1>${title}</h1>
    <nav>
      <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/about">About</a></li>
      </ul>
    </nav>
  </header>
</#macro>

在不同的页面中，只需调用这个宏：

<@commonHeader title="Welcome to My Site"/>

此外，将常用的HTML片段分离成独立的文件并在需要的地方引入，也能进一步提升可维护性。例如，可以将页脚部分放在一个单独的文件中，然后通过#include指令引入：

<#include "footer.ftl" />

这种方式不仅减少了重复的HTML结构，还方便了在项目中的修改和更新。

建议可以查阅FreeMarker的官方文档，了解更详细的宏和包含文件的使用。这将有助于进一步提升项目的代码质量和团队的协作效率。

3天前回复举报

添加新评论

暴雪

刚才

务必注意<#include>的路径问题！在包含其他模板时，总是测验一下模板路径，确保正确信息被引入。

赞 0 回复举报

达浪： @暴雪

在使用 FreeMarker 模板时，路径的管理确实是一个重要的细节。漏掉了这一步，可能会导致模板无法正确渲染。在使用 <#include> 时，确保路径是相对的或者绝对的，特别是在复杂的项目结构中，一点点小错误都可能造成大问题。

例如，假设有以下目录结构：

/project
    /templates
        main.ftl
        /partials
            header.ftl

在 main.ftl 中引入 header.ftl，可以使用：

<#include "partials/header.ftl">

如果路径写错，模板可能会找不到文件，返回错误信息。为了更好地管理路径，可以考虑将模板放在一个统一的目录下，并用统一的规则来引用它们。

最好在项目开始时就制定一个路径规范，比如在 FreeMarker 设置中定义基础路径，这样在使用 <#include> 的时候可以减少出错的机会。更多的信息可以参考 FreeMarker 官方文档。

确保在使用模板的时候，路径问题不再是个烦恼，这样可以让代码更加整洁且易于维护。

11月14日回复举报

添加新评论

forver

刚才

我很赞同这种模块化设计，尤其是避免了多个文件间的重复代码，并且使用布局模板能快速改变显示内容而不影响整体结构。

赞 0 回复举报

声色： @forver

在模块化设计中，FreeMarker的模板继承确实是一个强大的工具，能够有效提升代码的可维护性和可复用性。使用基模板来定义页面的共同结构，如导航栏、页脚等，然后让具体页面模板来扩展这些基模板，能有效减少重复代码。

例如，定义一个基模板 base.ftl：

<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
</head>
<body>
    <header>
        <h1>网站标题</h1>
    </header>
    <div>
        <#include "${contentTemplate}">
    </div>
    <footer>
        <p>版权所有 © 2023</p>
    </footer>
</body>
</html>

然后具体页面模板可以这样继承：

<#assign contentTemplate="homeContent.ftl">
<#include "base.ftl">

这样，当你需要变更布局，比如调整页脚样式，只需修改 base.ftl，所有引用该模板的页面都会自动更新，极大地提高了效率。

建议深入了解FreeMarker的文档，尤其是模板继承的部分，可以参考FreeMarker官方文档。这种设计方式不仅提升了开发效率，也使得团队协作更为顺畅。

6天前回复举报

添加新评论

分手快乐

刚才

每个开发者都应该了解这些技巧，这样可以更快上手FreeMarker。文档和社区资源也许是很好的参考，像这篇：FreeMarker Tutorial。

赞 0 回复举报

韦金菊： @分手快乐

学习FreeMarker模板继承的确是提升代码复用性的有效途径。掌握这一技术后，可以通过创建一个基础模板来定义共享的结构和样式，子模板则可以继承该基础模板并添加或覆盖特定内容。

举个简单的例子，假设有一个基础页面模板base.ftl，其中包含了网站的头部和尾部：

<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
</head>
<body>
    <header>
        <h1>欢迎来到我的网站</h1>
    </header>

    <div>
        <#-- 这部分由子模板填充 -->
        <#include contentTemplate />
    </div>

    <footer>
        <p>版权所有 © 2023</p>
    </footer>
</body>
</html>

然后，创建一个具体页面的模板home.ftl，它继承自base.ftl，并填充contentTemplate部分：

<#assign contentTemplate="homeContent.ftl" />

<#include "base.ftl">

而homeContent.ftl则可以是这样：

<p>这是主页的内容。</p>

这样，通过模板继承和分割，修改网站的大部分结构变得更为轻松。可以参考FreeMarker的官方文档 FreeMarker Documentation 来获得更深入的理解和实例，尤其是在处理复杂项目时，模板的层次化管理会极大提高开发效率。

刚才回复举报

添加新评论

一纸

刚才

通过使用这些方法提升复用性和维护性，真的让开发变得轻松多了。尤其是调整页面时，替换模板的感觉非常棒。

赞 0 回复举报

勒焱： @一纸

在使用FreeMarker模板继承进行代码复用时，能够有效简化页面结构和减少重复代码。例如，通过定义一个基础模板，可以在多个页面中共享相同的布局。这样，不论是更新导航栏还是修改页脚，只需在基础模板中进行一次修改即可。

以下是一个简单的示例，展示了如何通过模板继承来实现复用：

<!-- base.ftl -->
<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
</head>
<body>
    <header>
        <h1>网站标题</h1>
    </header>
    <div class="content">
        <#nested />
    </div>
    <footer>
        <p>&copy; 2023 我的公司</p>
    </footer>
</body>
</html>

<!-- page.ftl -->
<#super.base>
<#assign title = "首页">
<h2>欢迎来到我的网站</h2>
<p>这是首页内容。</p>

通过这种方式，不仅提高了代码的复用性，也增强了维护性。在需要进行大规模 redesign 时，只需调整 base.ftl 文件，所有继承了该模板的页面都会自动更新。

此外，建议可以参考 FreeMarker 官方文档获取更深入的了解，特别是在模板宏和自定义指令的使用方面，这将进一步提升我们构建灵活、可维护的模板的能力。

4天前回复举报

添加新评论

免费图表工具，画流程图、架构图