Flask开发（十）Jinja2模板模板的继承

2021-5-21

内容纲要

本篇导读：

继承语法
块的概念

一个系统网站往往需要统一的结构，这样看起来比较整洁。比如，一个页面中都有标题、内容显示、底部等几个部分。如果在每一个页面都进行这几部分的编写，那么整个网站会有很多的冗余部分，而编写的网页程序也不美观。这是可以采用模板继承，即将相同部分提取出来，形成一个base.html，具有这些相同部分的网页通过继承base.html来得到相应的模块。

1.模板继承的语法

{% extends "模板名称" %}

2.块的概念

模板继承包含基本模板和子模板。其中，基本模板里包含了网站里基本元素的基本骨架，但是里面有一些空的或不完善的块（block）需要用字幕版来填充。

在父模板中：

{% block block的名称 %}
{% endblock %}

在子模板中：

{% block block的名称 %}
子模板的代码
{% endblock %}

在templates中新建base.html、index.html、product.html三个文件，base为基类，index和product文件作为子类去继承基类的的本内容。

base.html文件内容如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %}</title>
</head>
<body>
    {% block body %}
        这是基类中的内容
    {% endblock %}
</body>
</html>

index.html文件内容如下：

{% extends "base.html" %}
{% block body %}
    {{ super() }}
    <h4>这是首页的内容</h4>
    <a href="/product">点击此处跳转产品列表页</a>
{% endblock %}

product.html文件的内容为：

{% extends "base.html" %}
{% block title %}产品列表页{% endblock %}
{% block body %}
    <h4>这是产品列表页的内容</h4>
    取得的网页标题内容：<h4>{{ self.title() }}</h4>
{% endblock %}

app.py文件的内容如下：

from flask import Flask,render_template

app = Flask(__name__)


@app.route('/')
def hello_world():
    return render_template("index.html")

@app.route('/product')
def product():
    return render_template("product.html")


if __name__ == '__main__':
    app.run(debug=True)

运行效果如下：