11、模板中的可复用代码块
单文件中的宏
模板文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>宏的定义和使用</title>
</head>
<body>
{#宏的定义 #}
{% macro input(name, type='text', value= '') %}
<input type="{{ type }}" name="{{ name }}" value="{{ value }}" />
{% endmacro %}
{#宏的使用#}
<div style="color: #0000ff;">
<p>用户名 :{{ input('username')}}</p>
<p>密 码 :{{ input('password',type='password')}}</p>
<p>登 录 :{{ input('submit',type='submit',value='登录')}}</p>
</div>
</body>
</html>
主程序文件
from flask import Flask,render_template
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
多文件中的宏
定义宏文件 form.html
{# 定义宏,并且它包含默认值。还可以被多个文件导入 #}
{% macro input(name, type='text', value= '' ,size='20', placeholder='') %}
<input type="{{ type }}" name="{{ name }}" value="{{ value }}" size="{{ size }}" placeholder="{{ placeholder }}">
{% endmacro %}
定义模板文件 index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>宏的导入</title>
</head>
<body>
{# 导入宏 #}
{% from 'form.html' import input %}
{# 使用宏 #}
<div style="color: #0000ff">
<p>用户名 :{{ input('username', placeholder='请输入用户名')}}</p>
<p>密 码 :{{ input('password',type='password', placeholder='请输入密码')}}</p>
<p>登 录 :{{ input('submit',type='submit',value='登录')}}</p>
</div>
</body>
</html>
定义主程序
from flask import Flask,render_template
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
if __name__ == '__main__':
app.run()
include 导入模板
include 可以用来导入模板:
定义待导入的模板 header.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Title</title>
</head>
<body>
<div class="header">这是网页头部</div>
</body>
</html>
定义待导入的模板 footer.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Title</title>
</head>
<body>
<div class="footer">这是网页尾部</div>
</body>
</html>
定义主模板
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Title</title>
<style type="text/css">
.header {
width: 100%;
height: 40px;
margin: 20px 20px;
}
.footer {
width: 100%;
height: 40px;
margin: 20px 20px;
}
.content {
width: 100%;
height: 40px;
margin: 20px 20px;
}
</style>
</head>
<body>
{% include "header.html" %}{# 导入模板 #}
<div class="content">这是网页内容</div>
{% include "footer.html" %}{# 导入模板 #}
</body>
</html>
定义主程序
from flask import Flask,render_template
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
if __name__ == '__main__':
app.run()
参考资料
本文作者:tiansz
本文链接:https://www.cnblogs.com/tiansz/p/16326071.html
版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)