Flask開發(fā)環(huán)境配置
Flask快速入門
Flask實(shí)踐Step by Step -- 'Hello World'
Flask實(shí)踐Step by Step -- 模板
Flask實(shí)踐Step by Step -- Web表單
模板
在上節(jié)中Hello World的程序以及可以順利運(yùn)行框杜，大概得目錄結(jié)構(gòu)如下：
microblog/
|-- app
| |-- __init__.py
| |-- __init__.pyc
| |-- static
| |-- templates
| |-- views.py
| `-- views.pyc
|-- run.py
`-- tmp
運(yùn)行 python run.py 可以在瀏覽器中通過 http://127.0.0.1:5000訪問
為什么使用模板
如果想在歡迎頁面加入一些歡迎語常拓，如果使用python來寫HTML的話，需要修改一下 views.py中的
邏輯本砰，具體的代碼如下:
from app import app
@app.route('/')
@app.route('/index')
def index():
user = {'nickname': 'Miguel'} # fake user
return '''
<html>
<head>
<title>Home Page</title>
</head>
<body>
<h1>Hello, ''' + user['nickname'] + '''</h1>
</body>
</html>
'''
保存涵卵，運(yùn)行可以在頁面中看到效果
使用模板
可以將HTML和python代碼分離磕瓷，我們需要寫第一個(gè)模板(file app/templates/index.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ title }} - microblog</title>
</head>
<body>
<h1>Hello,{{ user.nickname }}</h1>
</body>
</html>
標(biāo)準(zhǔn)的HTML頁面的內(nèi)容腥椒，{{...}}是需要動態(tài)顯示的內(nèi)容虽惭，然后就需要修改對應(yīng)的方法(file app/views.py)
from flask import render_template
from app import app
@app.route('/')
@app.route('/index')
def index():
user = {'nickname': 'Miguel'} # fake user
return render_template('index.html',title = 'Home',user = user)
然后運(yùn)行看一下效果梧宫，
為了渲染模板接谨，需要引入 render_template,這個(gè)方法第一個(gè)參數(shù)就是需要渲染的文件名，運(yùn)行時(shí)會
自動到 templates文件夾中去尋找對應(yīng)的文件祟敛，后面是參數(shù)的list
模板中的控制邏輯
在Jinja2模板中支持控制邏輯 需要包含在 {% ... %}塊中疤坝，修改一下 app/templates/index.html
加入一下控制邏輯
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
{% if title %}
<title>{{ title }} - microblog</title>
{% else %}
<title>Welcome to microblog</title>
{% endif %}
</head>
<body>
<h1>Hello,{{ user.nickname }}</h1>
</body>
</html>
可以把 app/views.py中的title的參數(shù)去除運(yùn)行看一下實(shí)際的效果
在模板中加入循環(huán)邏輯
修改一下 app/views.py，手動加入一些測試的數(shù)據(jù)信息
from flask import render_template
from app import app
@app.route('/')
@app.route('/index')
def index():
user = {'nickname': 'Miguel'} # fake user
posts = [
{
'author':{'nickname':'John'},
'body':'Beautiful day in Beijing!'
},
{
'author':{'nickname':'Kevin'},
'body':'The Aveengers movie so cool!'
}
]
return render_template('index.html',title = 'Home', user = user , posts = posts)
為了渲染這個(gè)list中的數(shù)據(jù)馆铁，需要修改一下模板中的結(jié)構(gòu) (file app/templates/index.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
{% if title %}
<title>{{ title }} - microblog</title>
{% else %}
<title>Welcome to microblog</title>
{% endif %}
</head>
<body>
<h1>Hello,{{ user.nickname }}</h1>
{% for post in posts %}
<div>
<p>
{{ post.author.nickname}} says: <b>{{ post.body }}</b>
</p>
</div>
{% endfor %}
</body>
</html>
模板繼承
通常一個(gè)網(wǎng)站會有對應(yīng)的導(dǎo)航欄和頭部以及尾部信息跑揉，我們不希望在每一個(gè)頁面中都要重新寫一遍
這可以考慮將這些公有的信息統(tǒng)一放在一個(gè)公有的模板頁面中其他的頁面只需要繼承這個(gè)頁面即可
在Flask中的木耙支持繼承，首先我們需要一個(gè)base模板(file app/templates/base.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
{% if title %}
<title>{{ title }} - microblog</title>
{% else %}
<title>Welcome to microblog</title>
{% endif %}
</head>
<body>
<div>
Microblog : <a href="/index">Home</a>
</div>
<hr>
{% block content %}{% endblock %}
</body>
</html>
在這個(gè)模板中埠巨，使用block是需要繼承的地方历谍，Blocks需要一個(gè)唯一的名字，不能有重復(fù)辣垒，block
的內(nèi)容會被子模板替換
修改一下 index.html繼承base.html
{% extends "base.html" %}
{% block content %}
<h1>Hi,{{user.nickname}}</h1>
{% for post in posts %}
<div>
<p>
{{ post.author.nickname }} says: {{ post.body }}
</p>
</div>
{% endfor %}
{% endblock %}
使用關(guān)鍵字extends來繼承base模板
