Python的Flask框架标配模板引擎Jinja2的使用教程

好的。以下是“Python的Flask框架标配模板引擎Jinja2的使用教程”的完整攻略：

什么是Jinja2

Jinja2是Flask框架默认的模板引擎。它是一个基于Python的高级模板引擎，它的设计初衷是为了和Flask框架紧密结合，因此其语法与Python非常相似。

Jinja2支持继承、过滤器、变量、控制结构等常见的模板引擎功能。同时也支持自定义过滤器、函数等扩展功能。

Jinja2模板的使用方法

基本语法

Jinja2模板语法使用{{}}表示变量，{% %}表示控制结构，{# #}表示注释。

<!DOCTYPE html>
<html>
  <head>
    <title>Flask + Jinja2 示例</title>
  </head>
  <body>
    <h1>Hello, {{ name }}!</h1>
  </body>
</html>

上述示例中，{{ name }} 表示一个变量，它的值可以在代码中进行指定。例如:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def hello_world():
    return render_template('hello.html', name='Jinja2')

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

过滤器

Jinja2模板还支持过滤器，可以对变量进行处理。例如：

<!DOCTYPE html>
<html>
  <head>
    <title>Flask + Jinja2 示例</title>
  </head>
  <body>
    <h1>{{ name|join(', ') }}</h1>
  </body>
</html>

上述示例中，name 变量通过 |join(', ') 过滤器实现以逗号分隔每个单词。

控制结构

Jinja2模板支持 if/else、for 等控制结构。例如：

<!DOCTYPE html>
<html>
  <head>
    <title>Flask + Jinja2 示例</title>
  </head>
  <body>
    <ul>
      {% for item in items %}
        {% if item %}
          <li>{{ item }}</li>
        {% endif %}
      {% endfor %}
    </ul>
  </body>
</html>

上述示例中，items 是一个列表，在模板中使用 for 循环遍历列表，在遍历的过程中，使用 if 控制结构过滤掉空元素，最终输出列表中的每个元素到 HTML 页面上。

继承

Jinja2模板还支持模板继承，让我们可以更加优雅地组织我们的网站页面。例如：

base.html

<!DOCTYPE html>
<html>
  <head>
    <title>{% block title %}Flask + Jinja2 示例{% endblock %}</title>
  </head>
  <body>
    <div class="header">
      {% block header %}{% endblock %}
    </div>
    {% block content %}{% endblock %}
    <div class="footer">
      {% block footer %}{% endblock %}
    </div>
  </body>
</html>

child.html

{% extends "base.html" %}

{% block title %}Flask + Jinja2 子页面示例{% endblock %}

{% block header %}
  <h1>Flask + Jinja2 子页面示例</h1>
{% endblock %}

{% block content %}
  <p>这是子页面的内容。</p>
{% endblock %}

{% block footer %}
  <p>版权所有 © 2021</p>
{% endblock %}

上述示例中，child.html 继承了 base.html 模板，并在 block 中覆盖了父模板中的内容。

示例

示例1：变量和过滤器的使用

代码：

<!DOCTYPE html>
<html>
  <head>
    <title>Flask + Jinja2 示例</title>
  </head>
  <body>
    <h1>{{ name|title }}</h1>
    <p>{{ description|truncate(30, True) }}</p>
    <ul>
      {% for item in items %}
        {% if item %}
          <li>{{ item }}</li>
        {% endif %}
      {% endfor %}
    </ul>
  </body>
</html>

flask部分：

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    name = 'james'
    description = 'Hello, this is a description of the new site'
    items = ['item1', 'item2', 'item3']
    return render_template('example.html', name=name, description=description, items=items)

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

上述示例中，定义了变量 name、description、items 并在 Flask 中 render_template 函数生成 HTML 页面，展示了变量和过滤器的使用。

示例2：页面继承

代码：

base.html

<!DOCTYPE html>
<html>
  <head>
    <title>{% block title %}Flask + Jinja2 示例{% endblock %}</title>
  </head>
  <body>
    <div class="header">
      {% block header %}{% endblock %}
    </div>
    {% block content %}{% endblock %}
    <div class="footer">
      {% block footer %}{% endblock %}
    </div>
  </body>
</html>

child.html

{% extends "base.html" %}

{% block title %}Flask + Jinja2 子页面示例{% endblock %}

{% block header %}
  <h1>Flask + Jinja2 子页面示例</h1>
{% endblock %}

{% block content %}
  <p>这是子页面的内容。</p>
{% endblock %}

{% block footer %}
  <p>版权所有 © 2021</p>
{% endblock %}