【python-flask学习笔记】2.5 Jinja2模版-继承、包含页、宏macro、块block、set及with

 

1、继承extends

作用：将模板公用的代码放在父模板base.html中，其他html页面通过继承父模板的方式避免重复的代码

语法：{% extends 'base.html' %}

2、包含页include

如果有一些HTML代码是经常用到的固定的，为了避免整个HTML文档看起来很拥挤，内容嘈杂。

可以将这一部分的代码，保存为了一个HTML模板，然后要用的时候，再用

{% include 'includes/_head.html' %}

包含的方法引用过来，引号里是路径，includes是templates下的一个文件夹，这个看你放在哪里，就填哪里的路径了。

3、宏macro

• 宏的定义：

下面定义一个<input/>的函数，通过做成宏，可以将一些参数修改成我们想要的默认值，然后调用的时候就像函数一样调用，很方便。

{# 定义宏 #}
{% macro input(name,value='',type='text',size=20,placeholder='') %}
    <input type="{{ type }}"
        name="{{ name }}"
        value="{{ value }}"
        size="{{ size }}"
        placeholder="{{ placeholder }}"
        />
{% endmacro %}

• 宏的调用：

{{ input('username') }}
{{ input('password',type='password') }}

• 宏的集合做成库:

宏跟函数差不多，Python的函数可以封装在库里，那么是不是也可以将很多宏集合在一起（一个HTML中）,要用的时候像调用库函数一样import使用呢？

答案是当然可以的。这个做法还有一个好处，就是让我们的主HTML文件，内容更加简练。节省空间，可读性更强。

　　下面我们举例将好多个macro放在'_macro.html'中，其中有<input/>宏

然后如何引入到我们的文件里呢?

• 第一种导入方法：导入'_macro.html'文件中的全部宏

{% import '_macro.html' as ui %}

• 第二种导入方法：导入'_macro.html'文件中的某个指定的宏

{% from '_macro.html' import input as my_input %}

这里注意，这里 as 库名 ，即起个别名，其中第一种导入方法必须其别名，不然我们引用函数的时候，都不知道从哪里来的函数

调用的方式也有点改变。第二种导入方法可以不起别名。具体调用如下：

• 第一种导入方法的调用：

{{ ui.input('username') }}
{{ ui.input('password',type='password') }}

• 第二种导入方法的调用：

{{ my_input('username') }}
{{ my_input('password',type='password') }}

4、块block

模板的文件一般放在templates文件夹下，我们这里新建一个HTML文件，存放模板，'base.html'

在这里面也，编排了整个页面的排版，里面会用到很多block的占位符。

每个block都代表一段html语句块，而这些块在哪里定义呢，可以在当前的base.html中定义，也可以在别的html中定义。反正要有一处定义，没有定义块只是没有效果而已

定义的时候，home.html 顶部必须说明 继承关系 (如果py文件链接的是home.html，但home.html引用了base.html的模板，就要说明)

{% extends 'base.html' %}

• 块的定义格式：endblock 后面块名可以省略，有时候加上会让结构更加明晰

{% block 块名 %}
    块内容
{% endblock (块名) %}

• 块的覆盖情况

有一种情况，base.html中定义了block B 块内容1，但是在home.html也定义block B 块内容2，注意这时会优先显示内容2，因为把内容1覆盖了。

理解起来，就是base.html是通用模板，我们可以直接引用过来，没有问题，但是也可以自定义块，修改通用模板的内容，达到我们想要的效果。

举个例子：在base.html中

<footer>
    {% block footer %}
        <p>联系我们</p>
        <p> <a href="www.baidu.com">我的主页</a> </p>
    {% endblock %}
</footer>

子页home.html文件继承了母版页base.html。

如果我们在子页home.html文件中不再自定义footer这个块，就会按照母版base.html这个通用模板的内容显示。

但如果觉得母版模板的footer这个块还行，不想覆盖，还想在这个基础上再添加些东西，比如想要上面添加一条水平线作为分隔符，该怎么做呢？

做法是，也是在home.html重新定义块，但是需要用到super()函数。否则若不用super()这个关键字的话，母版页里的这部分内容就会被覆盖掉，只显示子页home.html里重新定义的内容。如下：

{% block footer %}
    <hr>
    {{ super() }}
{% endblock %}

{{ super() }} 就表示了通用模板base.html里的内容

• 重复使用某块的内容：

Jinja语句每个html文件中每个block名字是唯一的，若想重复使用，可用self.block_name()进行再次引用，格式为{{ self.块名() }}。

如重复用名为contents这个块的内容：

{{ self.contents() }}

5、set、with语句

set语句

在模版中可以用set来定义变量。一旦定义了变量，以后就可以在该模板文件内之后的代码中使用：

{% set username=" zihliao" %}
<p>{{ username }}</p>

注：set语句没有endset

with语句

定义的变量，只能在with代码块中使用，超过了就无法再使用

{% with classroom='zhilioa1ban'  %}
<p>{{ classroom }}</p>
{% endwith %}
<p>{{ classroom }}</p>

with语句也可以跟set一起使用，此时set定义的变量只能在with块中使用，但同样with中用set定义的变量也仍只能在with语句块内使用。

{% with  %}
    {% set classroom='zhin'  %}
<p>{{ classroom }}</p>
{% endwith %}

---

不足之处，不吝赐教！