ThinkPHP的模板继承怎么用？ThinkPHP如何复用布局文件？-ThinkPHP-PHP中文网

ThinkPHP的模板继承怎么用？ThinkPHP如何复用布局文件？

煙雲

发布： 2025-08-02 20:05:01

原创

547人浏览过

模板继承通过创建基础模板并定义可覆盖的区块来减少重复代码，子模板使用{extend}继承并用{block}覆盖内容，多级继承需逐级使用{extend}，为避免性能问题应减少继承层级、合理划分区块、启用模板缓存、使用cdn及避免模板内复杂逻辑，最终提升开发效率与页面性能。

ThinkPHP的模板继承怎么用？ThinkPHP如何复用布局文件？

模板继承，说白了，就是让你在ThinkPHP里少写重复代码，特别是那些页面公共的部分，比如头部、尾部、导航栏什么的。你可以定义一个基础模板，然后其他页面继承它，只修改需要变化的部分。这样，修改公共部分的时候，只需要改动基础模板，所有继承的页面就都更新了，省时省力。

解决方案

首先，你需要创建一个基础模板，通常命名为

base.html

登录后复制

或者

layout.html

登录后复制

之类的。这个基础模板里包含所有页面的公共部分，并且定义一些“区块”（block），用来给子模板填充内容。

立即学习“PHP免费学习笔记（深入）”；

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{block name="title"}默认标题{/block}</title>
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>

    <div id="header">
        {block name="header"}
        <h1>网站头部</h1>
        {/block}
    </div>

    <div id="content">
        {block name="content"}
        <p>这里是默认内容，子模板可以覆盖。</p>
        {/block}
    </div>

    <div id="footer">
        {block name="footer"}
        <p>版权所有 © 2023</p>
        {/block}
    </div>

</body>
</html>

登录后复制

注意看上面的

{block}

登录后复制

标签，它定义了一个区块。

name

登录后复制

属性是区块的名字，子模板可以通过这个名字来覆盖或扩展这个区块的内容。

然后，创建一个子模板，比如

index.html

登录后复制

，继承基础模板。

{extend name="base" /}

{block name="title"}首页 - 我的网站{/block}

{block name="header"}
    {include file="public/nav" /}
{/block}

{block name="content"}
    <h2>欢迎来到我的网站！</h2>
    <p>这里是首页的内容。</p>
{/block}

登录后复制

这里，

{extend name="base" /}

登录后复制

表示继承

base.html

登录后复制

模板。然后在各个

{block}

登录后复制

里，就可以定义子模板的内容了。如果子模板没有定义某个区块，那么就会显示基础模板里该区块的默认内容。

{include file="public/nav" /}

登录后复制

是引入公共的导航栏文件。

关键点：

```
{extend name="base" /}
```
登录后复制
：指定继承的模板。
```
{block name="区块名"}
```
登录后复制
：定义区块，子模板可以覆盖或扩展。
```
{include file="模板文件路径" /}
```
登录后复制
：引入其他模板文件，实现更细粒度的复用。

ThinkPHP模板继承的优势在于，它能显著减少重复代码，提高开发效率，并且让你的网站结构更清晰，更容易维护。

如何解决模板继承后样式丢失的问题？

这个问题通常是因为CSS或JS文件的路径不正确导致的。

路径问题： 确保你的CSS和JS文件的路径是相对于模板文件的正确路径。如果你把CSS文件放在
```
public/static/css/
```
登录后复制
目录下，并且你的模板文件在
```
application/index/view/
```
登录后复制
目录下，那么在模板文件中引用CSS文件时，应该使用相对于
```
public
```
登录后复制
目录的路径，例如：
```
<link rel="stylesheet" href="/static/css/style.css">
```
登录后复制
。绝对路径
```
/static/css/style.css
```
登录后复制
从网站根目录开始寻找。相对路径
```
./static/css/style.css
```
登录后复制
从当前文件所在目录开始寻找。
继承后的路径： 如果你的CSS和JS文件是在基础模板中引用的，而子模板继承了基础模板，那么路径问题通常不会出现。但如果子模板需要引入额外的CSS或JS文件，那么同样需要注意路径的正确性。
浏览器缓存： 有时候，即使你的路径是正确的，浏览器也可能因为缓存而加载旧的CSS或JS文件。你可以尝试清除浏览器缓存，或者在CSS和JS文件的URL后面添加一个版本号，例如：
```
<link rel="stylesheet" href="/static/css/style.css?v=1.0">
```
登录后复制
。
资源文件部署： 确保你的静态资源文件（CSS、JS、图片等）已经正确部署到服务器上，并且可以通过URL访问。
检查开发者工具： 打开浏览器的开发者工具（通常是F12键），查看“Network”选项卡，检查是否有CSS或JS文件加载失败。如果有，可以查看具体的错误信息，帮助你找到问题所在。
使用公共函数： ThinkPHP提供了一些公共函数，可以帮助你生成正确的URL。例如，可以使用
```
__PUBLIC__
```
登录后复制
常量来表示
```
public
```
登录后复制
目录的URL。例如：
```
<link rel="stylesheet" href="{:__PUBLIC__}/static/css/style.css">
```
登录后复制
。

如何实现多级模板继承？

AiPPT模板广场

AiPPT模板广场-PPT模板-word文档模板-excel表格模板

查看详情

多级模板继承其实和单级继承的原理是一样的，只不过是继承的层级更多了。你可以创建一个基础模板，然后创建一个中间模板继承它，最后再创建一个子模板继承中间模板。

例如，你有三个模板：

base.html

登录后复制

（基础模板）、

layout.html

登录后复制

（中间模板）、

index.html

登录后复制

（子模板）。

base.html

登录后复制

：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{block name="title"}默认标题{/block}</title>
</head>
<body>

    <div id="header">
        {block name="header"}
        <h1>网站头部</h1>
        {/block}
    </div>

    <div id="content">
        {block name="content"}
        <p>这里是默认内容，子模板可以覆盖。</p>
        {/block}
    </div>

    <div id="footer">
        {block name="footer"}
        <p>版权所有 © 2023</p>
        {/block}
    </div>

</body>
</html>

登录后复制

layout.html

登录后复制

：

{extend name="base" /}

{block name="header"}
    {include file="public/nav" /}
{/block}

{block name="content"}
    <div class="container">
        {block name="main"}
        <p>这里是中间模板的内容，子模板可以覆盖。</p>
        {/block}
    </div>
{/block}

登录后复制

index.html

登录后复制

：

{extend name="layout" /}

{block name="title"}首页 - 我的网站{/block}

{block name="main"}
    <h2>欢迎来到我的网站！</h2>
    <p>这里是首页的内容。</p>
{/block}

登录后复制

在这个例子中，

index.html

登录后复制

继承了

layout.html

登录后复制

，而

layout.html

登录后复制

又继承了

base.html

登录后复制

。这样，

index.html

登录后复制

就可以同时使用

base.html

登录后复制

和

layout.html

登录后复制

中定义的区块和内容。

关键点：

每一级模板都使用
```
{extend name="模板名" /}
```
登录后复制
来指定继承的模板。
子模板可以覆盖或扩展父模板中定义的区块。
多级继承可以让你更灵活地组织和复用模板代码。

如何避免模板继承带来的性能问题？

模板继承虽然方便，但如果使用不当，可能会带来性能问题。因为每次渲染一个页面，都需要加载和解析多个模板文件。

减少继承层级： 尽量减少模板继承的层级。层级越多，加载和解析的模板文件就越多，性能损耗也就越大。
合理划分区块： 合理划分区块，避免过度使用区块。如果一个区块的内容很少，或者很少被子模板覆盖，那么可以考虑直接把内容写在基础模板中，而不是定义一个区块。
使用缓存： ThinkPHP提供了模板缓存功能，可以把解析后的模板文件缓存起来，下次渲染同一个页面时，直接使用缓存，避免重复解析模板文件。
```
// 在config/template.php中配置
'cache_prefix' => 'tpl_',
'cache_time'   => 3600, // 缓存时间，单位秒
```
登录后复制
使用静态缓存： 对于一些不经常变化的页面，可以使用静态缓存，把整个页面的HTML代码缓存起来，下次访问直接返回缓存的HTML代码，避免执行任何PHP代码。
优化数据库查询： 模板中经常会用到数据库查询的结果。优化数据库查询，减少查询次数，可以显著提高页面性能。
使用CDN： 把静态资源文件（CSS、JS、图片等）放在CDN上，可以加快资源的加载速度，提高页面性能。
避免在模板中执行复杂的逻辑： 模板的主要作用是展示数据，应该避免在模板中执行复杂的逻辑。如果需要在模板中执行复杂的逻辑，可以考虑把逻辑放在控制器中，然后把结果传递给模板。