Flask边学边做——2、添加jinja模板
之前我们建立已经建立了最小环境的web网站,而且浏览器页面返回Hello Guest的文本。虽然在这个页面我们可以加上html标签,如<h3>Hello Gutst</h3>丰富页面。但如果把大量的html语言写到同一个文件里,势必让文档结构混乱不堪。所以我们就可以用到Flask内置的jinja模板。
1、渲染模板文件
Flask通过渲染模板,把数据输入模板变量中。我们为index.py增加以下内容,来渲染模板文件。
from flask import Flask,render_template #从flask模块中导入Flask对象,导入render_template函数
app=Flask(__name__) #把Flask对象付给app变量
@app.route('/') #添加路由/
def index():
user='Michael Hu' #设定user变量
return render_template('index.html',user=user) #使用render_template渲染index.html模板,传递user变量
if __name__=='__main__':
app.run(debug=True) #启动app调试模式
导入render_template函数,用于渲染模板文件。
给定一个传入模板的user变量
用render_template函数指定渲染模板文件,传递指定变量
2、定义模板文件
模板文件其实就是一个文本文件,通常后缀名定义成html文件,模板文件里的变量可以接收应用传递来的值,并呈现出来。
在当前目录下的新建templates目录,并在该文件下新建index.html,代码内容如下:
<!DOCTYPE html>
<meta charset="utf-8">
<title>Default</title>
</head>
<h3>{{user}}</h3>
</body>
</html>
如直接用浏览器打开这个文件,页面仅显示{{user}},这个就是变量,接收来自应用的数据。
浏览器呈现效果如下:
index.py文件里增加字典数据
scores=[{'name':'michael','age':99},{'name':'yanyan','age':98},{'name':'tim','age':100}]
index.html模板文件循环显示
{%for score in scores%}
<table border="1">
<th>Index</th>
<th>Name</th>
<th>Age</th>
<td>{{loop.index}}</td>
<td>{{score.name}}</td>
<td>{{score.age}}</td>
</table>
{%endfor%}
loop.index可以在循环内迭代当前的索引,从1开始算
参见以下效果图:
basevar='base var'
contentvar='content var'
return render_template('child.html',title=title,basevar=basevar,contentvar=contentvar)
参见以下效果图:浏览器访问child页面,分割符上的内容继承自base.html
7. 补充内容
Flask默认模板文件都位于templates目录下,也可以通过生成app对象修改默认目录app = Flask(__name__,template_folder='tpl')
参考内容:使用Jinjia2模板(上),使用Jinjia2模板(中)