在 Flask 中，Jinja2 是默认的模板引擎，用于渲染动态内容。使用 Jinja2，你可以将 Python 代码与 HTML 代码分离，提高代码的组织性和可维护性。
基本概念
Jinja2 允许在 HTML 文件中嵌入 Python 代码。它提供了很多强大的功能，比如模板继承、变量替换、条件语句和循环等。
创建 Flask 应用
首先，我们创建一个简单的 Flask 应用并组织项目结构。
1
2
3
4
| /my_flask_app
├── app.py
└── templates
└── index.html
|
app.py
1
2
3
4
5
6
7
8
9
10
11
| from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
user = {"username": "小明"}
return render_template('index.html', user=user)
if __name__ == '__main__':
app.run(debug=True)
|
index.html
在 templates/index.html 文件中，我们可以使用 Jinja2 语法来渲染数据。
1
2
3
4
5
6
7
8
9
10
11
| <!doctype html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>欢迎页面</title>
</head>
<body>
<h1>欢迎, {{ user.username }}!</h1>
<p>这是一个使用 Jinja2 模板的示例。</p>
</body>
</html>
|
在上面的代码中，{{ user.username }} 是 Jinja2 的变量替换语法，user 是我们在 app.py 中传递给模板的上下文数据。
模板继承
Jinja2 支持模板继承，这使得我们可以创建基础模板，并在此基础上扩展其他模板。
基础模板
创建一个基础模板 base.html：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
| <!doctype html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>{% block title %}首页{% endblock %}</title>
</head>
<body>
<header>
<h1>我的网站</h1>
</header>
<main>
{% block content %}{% endblock %}
</main>
<footer>
<p>版权所有 © 2023</p>
</footer>
</body>
</html>
|
继承基础模板的页面
然后修改 index.html 以继承 base.html：
1
2
3
4
5
6
7
8
| {% extends "base.html" %}
{% block title %}欢迎{% endblock %}
{% block content %}
<h1>欢迎, {{ user.username }}!</h1>
<p>这是一个使用 Jinja2 模板的示例。</p>
{% endblock %}
|
在这里，{% extends "base.html" %} 表示当前模板继承自基础模板。{% block %}` 和 `{% endblock %} 用于定义可以被重写的区域。
条件语句与循环
Jinja2 还支持条件语句和循环，这是处理数据展示时非常实用的功能。
条件语句示例
假设我们想根据用户的登录状态显示不同的信息：
1
2
3
4
| @app.route('/')
def index():
user = {"username": "小明", "is_logged_in": True}
return render_template('index.html', user=user)
|
在 index.html 中使用条件语句：
1
2
3
4
5
| {% if user.is_logged_in %}
<h1>欢迎, {{ user.username }}!</h1>
{% else %}
<h1>欢迎, 访客!</h1>
{% endif %}
|
循环示例
如果我们想显示一组用户的列表，可以使用循环：
1
2
3
4
| @app.route('/users')
def users():
user_list = [{"username": "小明"}, {"username": "小红"}, {"username": "小蓝"}]
return render_template('users.html', users=user_list)
|
在 users.html 中渲染用户列表：
1
2
3
4
5
6
| <h1>用户列表</h1>
<ul>
{% for user in users %}
<li>{{ user.username }}</li>
{% endfor %}
</ul>
|
结论
通过使用 Jinja2 模板引擎，Flask 应用的动态内容渲染变得简洁而高效。我们可以轻松实现数据的展示、条件的判断以及循环的迭代。
掌握这部分内容是使用 Flask 和 Jinja2 开发 Web 应用的重要一步，建议多加练习以巩固理解。
