Flask_學習筆記_08: Flask中的過濾器
在很多blog的網站中，如果你註冊之後，登入進去，都有一個頭像，而且你會發現即使你沒有設定自己的頭像，也會有一個預設的頭像出現。比如51cto blog，如果博主沒有特別設定自己的頭像，那麼系統會預設顯示下面的白熊頭像：
如果設定了頭像，那就會顯示博主自定義的那個頭像，像本人的就是自定義設定的，顯示如下：
這個在Flask當中很好實現，用一個default的過濾器就搞定了：
.py程式碼如下：
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)
在.py程式碼中，很簡單，在返回render_template時，加上一個圖片的引數和圖片地址就OK。再來看看HTML中的程式碼，
HTML程式碼：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <img src="{{ avatar | default("http://ucenter.51cto.com/images/noavatar_middle.gif")}}" alt=""> </body> </html>
在HTML中，直接用img標籤，src設定成.py中的變數，然後重點來了，直接用default過濾器+一個管道符號+括號賦值即可，格式如下：
var_name | default("image location")
是不是很簡單？來看看效果，注意：.py程式碼中圖片沒有地址，是用的default過濾器中的地址，執行效果如下：
如果加上avatar這個變數引數，也就是說使用者自定義了一個頭像，那麼前端頁面要顯示這個自定義頭像的。.py程式碼里加上頭像引數：
return render_template('index.html', avatar='https://s5.51cto.com//wyfs02/M00/8E/4F/' 'wKiom1i84UPQpMOWAAAyWIOlDIo072_middle.jpg')
實際效果如下：
這是default過濾器，下面我們再來看另外一個length過濾器，那什麼時候會用到length過濾器呢？在一些有評論的網站中，每篇文章下面都會有評論數顯示吧？這個時候，就是用length過濾器的最好場景。
假如現在.py中有3條評論，那這個評論應該有誰發表的評論：user，發表了什麼樣的評論：content評論內容。
.py程式碼如下：
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def hello_world():
comments = [
{
'user': 'uncleben',
'content': '贊一個'
},
{
'user': '張總',
'content': '很好，加油'
},
{
'user': '楊總',
'content': '很好，加油'
},
]
return render_template('index.html',comments = comments, avatar = "https://s5.51cto.com//wyfs02/M00/8E/4F/"
"wKiom1i84UPQpMOWAAAyWIOlDIo072_middle.jpg")
if __name__ == '__main__':
app.run(debug=True)HTML中的程式碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<img src="{{ avatar | default("http://ucenter.51cto.com/images/noavatar_middle.gif")}}" alt="">
<hr>
<p>評論數（{{ comments|length }}）</p>
</body>
</html>所以跟之前的程式碼相比，其實就多了一行：<p>評論數（{{ comments | length }}）</p>
這個length過濾器其實就是對前面變數求長度，comments是一個list。
執行效果如下：
有點兒意思了吧！那下一步我們來實現顯示評論者和評論內容，其實也很簡單，用上一節學到的for迴圈，來遍歷comments這個list，就可以嘍！程式碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<img src="{{ avatar | default("http://ucenter.51cto.com/images/noavatar_middle.gif")}}" alt="">
<hr>
<p>評論數（{{ comments|length }}）</p>
<ul>
{% for comment in comments %}
<li>
<a href="##">{{ comment.user }}</a>
<p>{{ comment.content }}</p>
</li>
{% endfor %}
</ul>
</body>
</html>其實就是在原來的基礎上，加了一個<ul> <li> <p>標籤，來格式化顯示評論者，評論內容。實際效果如下：
好了，今天就到這裡。今天學習了：
- default過濾器，格式：var_name | default ( ' default value ')
- length過濾器，格式：var_name | length