Flask学习_2

模板继承

我们在制作Web程序时,一般会定义一个基模板,把网页上的导航栏、页脚等通用内容放在基模板里,而每一个继承基模板的子模板在被渲染时都会自动包含这些部分。用这种方式可以避免在多个模板中编写重复代码。

编写基模板

<!DOCTYPE html>
<html lang="en">
<head>
    {% block head %}
        <meta charset="UTF-8">
        <title>{% block title %}Template - HelloFlask{% endblock %}</title>
        {% block styles %}{% endblock %}
    {% endblock %}
</head>
<body>
<nav>
    <ul><li><a href="{{ url_for('hello') }}">Home</a></li></ul>
</nav>
<main>
    {% block content %}{% endblock %}
</main>
<footer>
    {% block footer %}
    ...
    {% endblock %}
</footer>
{% block scripts %}{% endblock %}
</body>
</html>

 

这就是一个基模板,它包含了程序页面的固定部分、HTML的基本结构。

子模板在基础基模板后会自动包含基模板的内容和结构。为了能让子模板方便地覆盖或插入内容到基模板中,我们在模板中定义了很多个块(block),在子模板中可以通过定义同名的块来执行继承操作。例如上面代码中的content块表示页面主体内容,footer表示页脚部分等等。块名可以随意指定。

子模板在继承时,只需要在子模板里定义同名块,再写上自己的内容即可。例如继承content

{% block content %}

<子模板内容>

{% endblock %}

块的结束标签也可以加上块名

{% block content %}

.....

{% endblock content %}

编写子模板

因为基模板已经定义了HTML基本结构,而且包含了固定信息,在子模板中我们只需要对特定的块进行修改。

{% extends 'base.html' %}
{% from 'macros.html' import qux %}

{% block content %}
{% set name='baz' %}
<h1>Template</h1>
<ul>
    <li><a href="{{ url_for('watchlist') }}">Watchlist</a></li>
    <li>Filter: {{ foo|musical }}</li>
    <li>Global: {{ bar() }}</li>
    <li>TestL: {% if name is baz %}I am baz.{% endif %}</li>
    <li>Macro:{{ qux(amount=5) }}</li>
</ul>
{% endblock %}

在开头一定要记住使用extends标签声明拓展基模板,它告诉模板引擎当前模板派生自base.html。一定要在开头!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值