当前位置: 代码迷 >> 综合 >> JinJa2-块和继承
  详细解决方案

JinJa2-块和继承

热度:75   发布时间:2023-11-25 02:29:38.0

块和继承

一般我们的网站虽然页面多,但是很多部分是重用的,比如页首,页脚,导航栏之类的。对于每个页面,都要写这些代码,很麻烦。

Flask的Jinja2模板支持模板继承功能,省去了这些重复代码。

父模板

{% block head %}<p>页首</p><hr>
{% endblock %}
{% block foutle %}<hr><p>页脚</p>
{% endblock %}

子模板

{% extends "父模板.html" %}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title>
</head><body>{% block head %}重写父模板头部{
   { super() }}{% endblock %}内容{% block foutle %}{
   { super() }}重写父模板尾部{% endblock %}</body>
</html>

include标签
这个标签相当于是直接将指定的模版中的代码复制粘贴到当前位置。 include 标签,如果想要使用父模版中的变量,直接用就可以了。 include 的路径,也是跟 import 一样,直接从 templates 根目录下去找,不要以相对路径去找。

head

{% block head %}<p>页面头部</p><hr>
{% endblock %}

foutle

{% block foutle %}<hr><p>页脚</p>
{% endblock %}

login page

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>登录</title>
</head>
<body>{% include "head.html" %}<p>用户:<input type="text"></p><p>密码:<input type="password"></p><p><input type="submit" value="登录"></p>{% include"foutle.html" %}
</body>
</html>

结果如下
在这里插入图片描述