flask的模板引擎 jinja2流程控制

jinja2是一种模板语言

  1. 三种语法:
    1 {{ }} 变量取值
    2 {% %} 控制结构
    3 {# #} 注释

jinja2模板中使用 {{ }} 语法表示一个变量,它是一种特殊的占位符。当利用jinja2进行渲染的时候,它会把这些特殊的占位符进行填充/替换,jinja2支持python中所有的Python数据类型比如列表、字段、对象等。

返回值为一个字典:jinja2读取数据钰python不同:

@web.route('/test')
def test():
    r = {
        'name': 'wang',
        'age': 20
    }
    return render_template('test.html', data=r)

# html 部分
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    wang
    {{ data.age }}
    {{ data['age'] }}
{# wang #}
{# 模板语言 #}
</body>
</html>

都可以取到20这个数据
python: r[‘age’]
jinja2:data.age data[‘age’]

jinja2的流程控制语句:
if 和 for in
语句必须是闭合的
if语句(endif)
可以使用一些python运算符

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    wang
    {{ data.age }}
    {{ data['age'] }}
    {% if data.age < 20 %}
        {{ data.name }}
    {% elif data.age == 20 %}
        do something
    {% else %}
        {{ data.age }}
        <ul></ul>
    {% endif %}
{# wang #}
{# 模板语言 #}
</body>
</html>

for in 循环(endfor)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    wang
    {{ data.age }}
    {{ data['age'] }}
    {# if 条件判断 #}
    {% if data.age < 20 %}
        {{ data.name }}
    {% elif data.age == 20 %}
        do something
    {% else %}
        {{ data.age }}
        <ul></ul>
    {% endif %}
    {# for in 循环 #}
    {% for foo in [1, 2, 3] %}
        {{ foo }}
        <div>111</div>
    {% endfor %}
    
{# wang #}
{# 模板语言 #}
</body>
</html>

layout.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    {# 定义三个区域 #}
    {% block head %}
        <div>this is head</div>
    {% endblock %}
    {% block content %}
        this is content
        {# 待替换的部分 #}
    {% endblock %}
    {% block foot %}
        <div>this is foot</div>
    {% endblock %}
</body>
</html>

test.html
加上super()方法,继承,保留之前填充部分的内容
不加super()方法,覆盖之前的所有内容

{% extends 'layout.html' %}
{% block content %}
    {{ super() }}  {# 继承,保留原来的content内容 #}
    {{ data.age }}
    {{ data['age'] }}
    {# if 条件判断 #}
    {% if data.age < 20 %}
        {{ data.name }}
    {% elif data.age == 20 %}
        do something
    {% else %}
        {{ data.age }}
        <ul></ul>
    {% endif %}
    {# for in 循环 #}
    {% for foo in [1, 2, 3] %}
        {{ foo }}
        <div>111</div>
    {% endfor %}
{% endblock %}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章