flask模板 - 6-模板继承 - 《Flask框架》

1、模板继承的语法
2、模板继承的注意事项
3、模板继承与include

1、模板继承的语法

在flask可以通过block在父模板中”一个口”，子模板在通过extends继承父模板是可以通过block留下的口子进行修改
block语句的使用：(不要忘记跟上名字哦，不然在继承修改时，计算机不知道你要改什么内容)

{% block name %}
    xxxxx
    xxxxx
{% endblock %}

子模板继承父模板（main.html）

{% extends "main.html" %}

一个简单的小例子：second.html模板对main.html模板的继承与重写
代码部分：

from flask import Flask, render_template
app = Flask(__name__)
app.config["TEMPLATES_AUTO_RELOAD"] = True
@app.route("/")
def main_html():
    return render_template("main.html")
@app.route("/second/")
def second_html():
    return render_template("second.html")
if __name__ == "__main__":
    app.run(debug=True)

main.html模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}mian{% endblock %}</title>
</head>
<body>
    <h1>欢迎来到xx公司</h1>
    {% block header %}
    <ul>
        <li>首页</li>
        <li>个人中心</li>
        <li>新闻</li>
    </ul>
    {% endblock %}
    <hr>
    {% block footer %}
        <footer>这是底部</footer>
    {% endblock %}
    <!--留下空白block,方便子模板进行代码的拓展-->
    {% block extend %}
    {% endblock %}
</body>
</html>

second.html模板

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
{% block header %}
    <ul>
        <li>次页</li>
        <li>娱乐</li>
        <li>音乐</li>
    </ul>
{% endblock %}
<!--拓展代码-->
{% block extend %}
    <p>这是拓展的部分</p>
{% endblock %}

页面显示：
mian.html

second.html

2、模板继承的注意事项

block的嵌套
{{ super() }}继承相对应的父模板中的block对应的内容
子模板中代码的拓展，在父模板中定义空白的block
在模板中extends导入模板要写在block前面
子模板不能够多继承

1、block的嵌套
main.html部分代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}mian{% endblock %}</title>
</head>
<body>
    {% block footer %}
        <p>你好，陌生人人</p>
        {% block foo %}
            <footer>这是底部</footer>
        {% endblock %}
        <p>晚安，世界</p>
    {% endblock %}
</body>
</html>

页面显示：

子模板部分代码（修改外层）

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
{% block footer %}
    <p>修改footer</p>>
{% endblock %}

页面显示：

子模板部分代码（修改内层）

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
{% block foo %}
    <footer>我对内层进行了修改</footer>
{% endblock %}

页面显示：

在子模板继承main.html模板时，可以只改动内部嵌套部分的而将外部的部分进行继承，也可以对外部的部分进行重写此时内部嵌套的block直接被重构，在子模板中调用block就是对其中的内容进行重写
2、{{ super() }}继承相对应的父模板中的block对应的内容
如果在子模板中既要保留原来的父模板的内容又要增加新的内容时可以通过{{ super() }}方法对父模板中的内容进行继承

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
{% block footer %}
    {{ super() }}
    <p>这是新增的部分</p>
{% endblock %}

页面显示：

3、子模板中代码的拓展，在父模板中定义空白的block
main.html模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}mian{% endblock %}</title>
</head>
<body>
    {% block footer %}
        <p>你好，陌生人人</p>
        {% block foo %}
            <footer>这是底部</footer>
        {% endblock %}
        <p>晚安，世界</p>
    {% endblock %}
    <!--留下空白block,方便子模板进行代码的拓展-->
    {% block extend %}
    {% endblock %}
</body>
</html>

子模板部分：
错误写法：(页面中不显示，新增的内容)

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
<ul>
    <li>python</li>
    <li>java</li>
</ul>

正确写法：

<!--继承main.html-->
{% extends "main.html" %}
<!--对需要修改的部分进行重写-->
{% block title %}second{% endblock %}
{% block extend %}
    <ul>
        <li>python</li>
        <li>java</li>
    </ul>
{% endblock %}

页面显示：

4、在模板中extends导入模板要写在block前面
由于代码执行顺序，只有进行导入父模板后，后面的block语句才能够生效，如果在导入前写block语句，将不会被识别
5、子模板不能够多继承
模板的继承不像是python中类的继承可以继承多个，它只能够继承一个父模板
错误的示范：

<!--第一种错误示范-->
{% extends "main.html", "main_2.html" %}
<!--第二种错误示范-->
{% extends "main.html" %}
{% extends "main_2.html" %}

3、模板继承与include

include：导入的html是写死的，在导入时书写的代码较为简单{% include “header.html” %}，快捷但是灵活性不够强
模板继承：完成代码的复写只需要一个html文件，子模板的修改只需要通过
{% block 相应的名称 %}xxx{% endblock %}的方式对原有的内容进行覆盖重写，更加灵活便捷，但是需要写入的部分较多

对于include而言它是一块一块分散的进行引用比如新建的模板中头部、尾部、导航窗格都具有相似性，但是要完成对这些重复代码的复用，需要创建3个html，然后通过{% include “header.html” %}这样的方式一个一个导入
而对于模板继承完成而言，只要在一个文件中写好这些相关的内容，并且通过block给子模板留下更改的余地，就可以完成相应的任务