Flask(8)- jinja2 模板入门(上)

简介: Flask(8)- jinja2 模板入门(上)

前言


  • 之前的文章有个栗子,视图函数可以直接返回一段 html 代码,浏览器可以自动渲染
  • 但是当你的 HTML 非常复杂的话,也要整串写在代码里面吗,这显然不合理的,可阅读性也非常差
  • 所以,就诞生了 Jinja2 这种模板引擎来解决需要返回复杂 jinja2 模板代码的问题

 

简单的栗子


以下是一个 jinja2 的模板,它对登录和未登录用户显示不同的信息

<html>
{% if login %}
  <p>你好,{{name}}</p>
{% else %}
  <a href='/login'>登录</a>
{% endif %}
</html>


如果用户已经登录:变量 login 为、变量 name 为 tom,模板被渲染成如下的 html 文件

<html>

 <p>你好,tom</p>

</html>

 

如果用户没有登录:变量 login 为,模板被渲染成如下的 html 文件:

<html>

 <a href='/login'>登录</a>

</html>

 

Flask 中使用模板


目录结构

image.png

一般来说 templates 就是存放模板的目录

 

jinja2 模板代码

<!DOCTYPE html>
<html>
<body>
  <h2>My name is {{ name }}, I am {{ age }} years old</h2>
</body>
</html>


flask 代码

  • 首先,需要 import render_template
  • 然后,视图函数调用 render_template,对模板 templates/index.html 进行渲染
  • render_template 包含有 2 个命名参数:name 和 age,模板引擎将模板 templates/index.html 中的变量进行替换
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
    return render_template('index.html', name='tom', age=10)
app.run(debug=True)


浏览器的运行效果

image.png

分界符


jinja2 模板文件混合 html 语法与 jinja2 语法,使用分界符区分 html 语法与 jinja2 语法。有 5 种常见的分界符:

  • {{ 变量 }},将变量放置在 {{ 和 }} 之间;
  • {% 语句 %},将语句放置在 {% 和 %} 之间;
  • {# 注释 #},将注释放置在 {# 和 #} 之间;
  • ## 注释,将注释放置在 # 之后

 

变量


语法

jinja2 模板中,使用 {{ var }} 包围的标识符称为变量,模板渲染会将其替换为 Python 中的变量,语法如下:

{{ 变量 }}

 

jinja2 模板

<html>
{{ string }}
<ul>
    <li> {{ list[0] }}
    <li> {{ list[1] }}
    <li> {{ list[2] }}
    <li> {{ list[3] }}
</ul>
<ul>
    <li> {{ dict['name'] }}
    <li> {{ dict['age'] }}
</ul>
</html>


包含有 3 种类型的变量:字符串、列表、字典,它们会被替换为同名的 Python 变量

 

flask 代码

from flask import Flask, render_template
app = Flask(__name__)
string = 'www.imooc.com'
list = ['www', 123, (1, 2, 3), {"name": "poloyy"}]
dict = {'name': 'zhangsan', 'age': True}
@app.route('/2')
def index2():
    return render_template('index2.html', string=string, list=list, dict=dict)
app.run(debug=True)


列表的值包含字符串、数字、元组、字典,字典的值包含字符串、布尔值

 

浏览器的运行效果

image.png

for 语句


语法

jinja2 模板中,使用 {% 语句 %} 包围的语法块称为语句,jinja2 支持类似于 Python 的 for 循环语句,语法如下:

{% for item in iterable %}

{% endfor %}

 

有些教程会说有另一种等价写法

# for item in iterable

# endfor

但我实验发现并不生效

 

jinja2 模板代码

<h1>Members</h1>
<ul>
{% for user in users %}
  <li>{{ user }}</li>
{% endfor %}
# for item in iterable
  <li>{{ user }}</li>
# endfor
</ul>





相关文章
|
7月前
|
安全 网络安全 数据安全/隐私保护
Flask 入门系列教程(六)
Flask 入门系列教程(六)
|
7月前
|
关系型数据库 数据库连接 数据库
Flask应用基础入门总结
Flask应用基础入门总结
77 0
|
6月前
|
API 网络架构 开发者
Flask Web开发基础【路由和Jinja2模板引擎】
# Flask Web开发基础 Flask是轻量级Web框架,专注于核心功能:请求响应、模板渲染和URL路由。本文档介绍了使用Flask的基础知识,包括命令行和Python两种运行模式,以及如何修改入口文件、端口和地址。此外,还讨论了URL路由的概念和其在Flask中的实现,展示了动态路由和多URL绑定的例子。最后,提到了Jinja2模板引擎,解释了其基本语法,并通过电影列表案例展示了如何结合Flask使用模板。
72 1
|
2月前
|
前端开发 JavaScript 数据库连接
一、Flask入门介绍
一、Flask入门介绍
44 1
|
2月前
|
Python
Flask 模板标签语言的使用
Flask 模板标签语言的使用
23 4
|
2月前
|
自然语言处理 Python
六、Flask模板使用方法
六、Flask模板使用方法
18 0
|
4月前
|
前端开发 Python
使用 Flask 3 搭建问答平台(三):注册页面模板渲染
使用 Flask 3 搭建问答平台(三):注册页面模板渲染
|
6月前
|
前端开发 JavaScript Python
flask实战-模板实现公共导航
在Flask中实现模板继承,创建基础模板`base.html`,包含公共导航菜单。子模板`movie-extends.html`继承`base.html`,并定义主要内容。视图函数`movie_extends_view`渲染`movie-extends.html`,显示电影列表。通过`extra_css`和`extra_js`块添加页面特定的样式和脚本,实现在`movie-extends.html`中应用自定义CSS样式。运行应用,访问http://127.0.0.1:1027/movie-extends,页面显示定制的电影列表样式。
93 2
|
7月前
|
数据库连接 Python
Flask 框架入门与实践:构建你的第一个 Web 应用
【5月更文挑战第18天】本文介绍了使用 Flask 框架构建第一个 Web 应用的步骤。首先通过 `pip install Flask` 安装框架,然后编写基本的 Python 代码创建应用,包括定义路由和响应。示例展示如何显示 &quot;Hello, World!&quot;,并扩展到显示用户信息的功能。利用模板(如 `index.html`)可使页面更丰富。随着学习深入,可以利用 Flask 的更多特性,如表单处理和数据库连接,来构建更复杂的 Web 应用。本文旨在激发读者对 Flask 和 Web 开发的兴趣,鼓励不断探索和实践。
150 7
|
7月前
|
Python
Flask中的模板的使用
Flask中的模板的使用
47 0