系统环境:Ubuntu 18.04.1 LTS
Python使用的是虚拟环境:virutalenv
Python的版本:Python 3.6.9
【简说Python WEB】Jinja2模板
早期的开发,前端代码和后端代码都是混合在一起的。例如:在早期的java web时期,html
和css
的一些前端元素,和后端的jsp代码都混在一起。使得代码难以维护。
现在,提倡前后端代码的分离,而Flask
中的Jinja2
模板用于代码分离,其中的变量通过真实值替换。
目前环境的代码树
(zsdpy1) zsd@zsd-virtual-machine:~/Zflask/chapter3/app$ tree
.
├── hello.py
└── templates
└── index.html
抽离出来的Html模板
其中templates/index.html
是我抽离出来的html。如下:
<html>
<head>
<title>{{ title }}-zsdblog</title>
</head>
<body>
<h1>您好, {{ user.username }},欢迎来到我的博客!</h1>
</body>
</html>
其中title
和user.username
是要传入的变量。
渲染模板
from flask import render_template
from flask import Flask
app = Flask(__name__)
@app.route('/')
@app.route('/index')
def index():
user = {'username': '东瑜'}
return render_template('index.html', title='Home', user=user)
if __name__ == '__main__':
app.run(host='0.0.0.0', port=9000)
执行语句:
(zsdpy1) zsd@zsd-virtual-machine:~/Zflask/chapter3/app$ python hello.py
* Serving Flask app "hello" (lazy loading)
* Environment: production
WARNING: This is a development server. Do not use it in a production deployment.
Use a production WSGI server instead.
* Debug mode: off
* Running on http://0.0.0.0:9000/ (Press CTRL+C to quit)
渲染效果:
条件语句
Jinja2
也提供条件判断,和if
语句类似。
templates/index_condition.html
模板如下:
<html>
<head>
<title>{{ title }}-zsdblog</title>
</head>
<body>
{% if user %}
<h1>您好, {{ user.username }},欢迎来到我的博客!</h1>
{% else %}
<h1>您好, 游客,欢迎来到我的博客!</h1>
{% endif %}
</body>
</html>
其中,程序的含义:
代表如果有user,就告知谁来了我的博客。如果没有user,就代表游客。
hello_condition.py
代码如下:
from flask import render_template
from flask import Flask
app = Flask(__name__)
@app.route('/')
@app.route('/index')
def index():
# user = {'username': '东瑜'}
return render_template('index_condition.html', title='Home')
if __name__ == '__main__':
app.run(host='0.0.0.0', port=9000)
可以看到,我注释了user对象,并且render_template参数的时候,也没有传user的变量。所以演示效果如下:
循环语句
相对于基础语法的for
循环。
templates/index_loop.html
模板语句如下:
<html>
<head>
<title>{{ title }}-zsdblog</title>
</head>
<body>
{% if user %}
<h1>您好, {{ user.username }},欢迎来到我的博客!</h1>
{% else %}
<h1>您好, 游客,欢迎来到我的博客!</h1>
{% endif %}
{% for post in posts %}
<div><p>{{ post.author.username }} 说: <b>{{ post.body }}</b></p></div>
{% endfor %}
</body>
</html>
web应用的代码如下:
from flask import render_template
from flask import Flask
app = Flask(__name__)
@app.route('/')
@app.route('/index')
def index():
user = {'username': '东瑜'}
posts = [
{
'author': {'username': '小明'},
'body': '北京的天气好好呀'
},
{
'author': {'username': '小黄'},
'body': '我今天很开心!'
}
]
return render_template('index_loop.html', title='Home', user=user, posts=posts)
if __name__ == '__main__':
app.run(host='0.0.0.0', port=9000)
演示效果如下: