Flask教程3:jinja2模板引擎

文章目录

模板的导入与使用
  • Flask通过render_template来实现模板的渲染,要使用这个方法,我们需要导入from flask import rander_template,模板中注释需放在{# #}

  • 模板的第一个参数为指定的模板文件名称,如自定义的html文件,第二个(及后续)参数为可选项,用于向模板中传递变量。

python 复制代码
from flask import Flask,render_template

app = Flask(__name__)

# 给前端模板传参
@app.route("/")
def index():
    data = {
        'name':'张三',
        'age':18,
        'mylist':[1,2,3,4,5,6,7]
    }
    # 以键值对的形式传参给模板index2.html
    # 左边是我们要在前端调用时使用的变量名称(形参:data);
    # 右边是我们给这个变量传的值(实参:字典data);
    return render_template('index2.html',data=data)

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

前端html模板内需要在双括号{``{ }}中使用该变量:

如果想给该变量添加属性便于CSS修改格式,我们可以在变量后添加括号,并在括号内定义class、id等属性 → \rightarrow →点击查看

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
hello world
<br>
<!-- 对传入变量的使用并显示:在双括号内,和python中用法类似 -->
{{ data }}
<br>
{{ data['name'] }}
<br>
{{ data.name }}
<br>
mylist:{{ data.mylist }}
<br>
mylist[1]:{{ data.mylist[1] }}
<br>
count:{{ data.mylist[1]+data.mylist[2] }}
</body>
</html>
相关推荐
Elastic 中国社区官方博客几秒前
从 Elasticsearch runtime fields 到 ES|QL:将传统工具适配到当前技术
大数据·数据库·sql·elasticsearch·搜索引擎·全文检索
刘晨鑫11 分钟前
MySQL主从复制与读写分离
数据库·mysql·adb
摇滚侠1 分钟前
JAVA 项目教程《苍穹外卖-10》,微信小程序项目,前后端分离,从开发到部署
java·开发语言·微信小程序
薛不痒3 分钟前
Llamafactory的使用(1)
人工智能·python·llama
wqww_13 分钟前
Java 前后端 WebSocket 完整实现
java·开发语言·websocket
ClouGence4 分钟前
数据迁移同步工具 CloudCanal-v5.5.0.0 发布,支持 RETL(定时扫描同步)
数据库·mysql·postgresql·oracle·sqlserver·kafka·etl
万琛4 分钟前
【Flink_CEP】MySQL 动态规则 + Kafka 实时流 + Flink CEP 后缀收集的实战方案
mysql·flink·kafka
不喝水的鱼儿4 分钟前
KT Qwen3.5-35B-A3B 记录
java·前端·python
DomDanrtsey5 分钟前
oracle与tidb时间格式化函数不兼容简述
数据库·oracle·tidb
小此方6 分钟前
Re:从零开始的 C++ STL篇(九)AVL树太“较真”,红黑树更“现实”:一文讲透工程中的平衡之道
开发语言·数据结构·c++·算法·stl