第三章--模版

模伴是一個包含響應文本的文件衫仑,其中包含用占位變量表示的動態(tài)部分,具體值只有在請求的上下文(request)中才能獲取巍棱。
處理模板時惑畴,使用真實變量替換占位變量,再返回最終得到的響應字符串(文件)航徙,這一過程稱為渲染如贷,F(xiàn)lask使用了Jinjia2這一強大的模板引擎進行渲染操作。

一到踏、Jinjia2 模版引擎

1杠袱、渲染模板

# user.html
<h1>Hello , {{ name }}  </h1>

默認情況下,flask在程序根目錄下的templates文件夾中尋找模板窝稿。

from flask import Flask, render_template
# flask提供的render_template函數將Jinjia2模版引擎集成到程序中
···
@app.route('/user/<name>'
def user(name):
    return render_template('user.html', name=name)

上述代碼展示了render_template如何將動態(tài)變量傳給模板并進行渲染
render_template函數接收多個參數楣富,但第一個參數必須為模板文件名稱,后續(xù)為表示動態(tài)變量的鍵值對伴榔。

2纹蝴、變量

在模板中使用"{{ name }}",雙大括號結構表示一個變量踪少,是模板特有的占位符塘安,用以告訴模板引擎這個位置從渲染模板時使用的數據中獲取。

Jinjia2能識別所有類型的變量援奢,包含復雜的(列表兼犯,字典,對象)集漾。

# 復雜類型示例
{{ dict['key'] }}
{{ list[3] }}
{{ obj.somemethod() }}

并且Jinjia2支持使用過濾器修改變量切黔,過濾器名添加在變量名之后,用豎線隔開具篇。

{{ name | capitalize }}

完整的過濾器列表

3纬霞、控制結構

Jinjia2提供了多種控制結構用來改變模板的渲染流程。

{% if user %}
    hello, {{ user }}
{% else %}
    hello, Stranger!
{% endif %}    #控制語句結束后必須使用 {% end+if/for...%}關閉

<ul>
    {% for comment in comments %}
        <li>{{ comment }}</li>
    {% endfor  %}
</ul>

模板繼承

{% extends "base.html" %}
{% block title %}
Index      #為父模板的title標簽添加內容
{% endblock %}
{% block head%}
  {{ super() }}    #獲取父模版head標簽內的內容
{% endblock %}

二驱显、Flask-Bootstrap

Bootstrap是Twitter開發(fā)的一個客戶端開源框架诗芜,并不會直接設計服務器內容侨舆。
服務器需要做的是提供引用了Bootstrap CSS和JS文件的HTML響應,并在HTML绢陌、CSS和JS中實例化所需組件,這些操作最理想的執(zhí)行場所就是模板熔恢。

pip install flask-bootstrap    #安裝
from flask.ext.bootstrap import Bootstrap    #引入
#···
bootstrap = Bootstrap(app)  #初始化

使用extends指令從flask-bootstrap中導入bootstrap/base.html脐湾,從而實現(xiàn)模板繼承。
該基模版提供了一個網頁框架叙淌,引入Bootstrap所需的所有CSS秤掌、JS文件。
如果需要對已有內容的模版添加新內容鹰霍,必須使用Jinjia2提供的super()函數

{% block scripts %}
{{ super() }}
<script type="text/javascript" src="my-script.js"></script>
{% endblock %}

三闻鉴、自定義錯誤頁面

為指定錯誤代碼自定義錯誤處理程序

@app.errorhandler(404):
def page_not_found(e):
    return render_template('404.html'), 404

需要編寫404.html模版,繼承base.html茂洒,并將head元素改為相應的錯誤信息孟岛。
為了避免過多的代碼重復以及將錯誤信息展示在合適的頁面,編寫handle.html模板督勺,繼承自bootstrap/base.html渠羞,將導航條及其他基本框架必備信息寫入,再新建404.html繼承handle.html模板。

{% extends "handle.html" %}
{% block title %}Page Not Found {% endblock %}
{% block page_content %} <h1>Not Found</h1>{% endblock %}

四、鏈接

任何具有多個路由的程序都需要可以連接不同頁面的鏈接(例:導航條)
flask提供了url_for()輔助函數茫负,可以使程序URL映射中保存的信息生成URL疆导。
url_for()最簡單的用法是以視圖函數名作為參數,返回對應的URL惑灵。
使用url_for()生成動態(tài)地址時,將動態(tài)部分作為關鍵字參數傳入。
傳入url_for()的關鍵字參數不僅限于動態(tài)路由中的參數盒卸,函數能將任何額外的參數添加到查詢字符串中,例:url_for('index', page=2) = /?page=2

五辨嗽、靜態(tài)文件

靜態(tài)文件作為Web程序的重要組成部分(CSS世落、JavaScript、圖片等)
默認設置下糟需,flask會在程序根目錄中名為static的子目錄中尋找靜態(tài)文件屉佳。

使用Flask-Moment本地化日期和時間

pip install flask-moment
from flask.ext.moment import Moment
moment = Moment(app)

當Web程序服務器不同地區(qū)和國家的用戶時,日期顯示是個非常關鍵的問題洲押,一般來說要根據用戶本地的時區(qū)來提供給用戶本地化的時間武花。
flask-moment 是使用javascript開發(fā)的優(yōu)秀客戶端開源代碼庫,它可以在瀏覽器中渲染日期和時間杈帐。

{% block scripts %}
{{ super() }}
{{ moment.include_moment() }}
{% endblock %}

將時間變量傳給模板進行渲染

#視圖函數
from datetime import datetime
@app.route('/')
def index():
    return render_template('index.html', current_time=datetime.utcnow())
#模板
<p>That was {{ moment(current_time).format('LLL')  }}</p>
<p>That was {{ moment(current_time).fromNow(refresh=True) }}</p>

format('LLL')根據客戶端電腦中的時區(qū)和區(qū)域設置渲染日期和時間体箕,參數決定了渲染的方式专钉,‘L’到‘LLL’分別對應不同的復雜度。
fromNow()渲染相對時間戳累铅,而且會隨著時間推移自動刷新顯示的時間跃须,最開始顯示為"a few seconds ago",逐步變成"a minute ago"娃兽。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末菇民,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子投储,更是在濱河造成了極大的恐慌第练,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,383評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件玛荞,死亡現(xiàn)場離奇詭異娇掏,居然都是意外死亡,警方通過查閱死者的電腦和手機勋眯,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,522評論 3 385
  • 文/潘曉璐 我一進店門婴梧,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人凡恍,你說我怎么就攤上這事志秃。” “怎么了嚼酝?”我有些...
    開封第一講書人閱讀 157,852評論 0 348
  • 文/不壞的土叔 我叫張陵浮还,是天一觀的道長。 經常有香客問我闽巩,道長钧舌,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,621評論 1 284
  • 正文 為了忘掉前任涎跨,我火速辦了婚禮洼冻,結果婚禮上,老公的妹妹穿的比我還像新娘隅很。我一直安慰自己撞牢,他們只是感情好,可當我...
    茶點故事閱讀 65,741評論 6 386
  • 文/花漫 我一把揭開白布叔营。 她就那樣靜靜地躺著屋彪,像睡著了一般。 火紅的嫁衣襯著肌膚如雪绒尊。 梳的紋絲不亂的頭發(fā)上畜挥,一...
    開封第一講書人閱讀 49,929評論 1 290
  • 那天,我揣著相機與錄音婴谱,去河邊找鬼蟹但。 笑死躯泰,一個胖子當著我的面吹牛,可吹牛的內容都是我干的华糖。 我是一名探鬼主播麦向,決...
    沈念sama閱讀 39,076評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼客叉!你這毒婦竟也來了磕蛇?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 37,803評論 0 268
  • 序言:老撾萬榮一對情侶失蹤十办,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后超棺,有當地人在樹林里發(fā)現(xiàn)了一具尸體向族,經...
    沈念sama閱讀 44,265評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,582評論 2 327
  • 正文 我和宋清朗相戀三年棠绘,在試婚紗的時候發(fā)現(xiàn)自己被綠了件相。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,716評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡氧苍,死狀恐怖夜矗,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情让虐,我是刑警寧澤紊撕,帶...
    沈念sama閱讀 34,395評論 4 333
  • 正文 年R本政府宣布,位于F島的核電站赡突,受9級特大地震影響对扶,放射性物質發(fā)生泄漏。R本人自食惡果不足惜惭缰,卻給世界環(huán)境...
    茶點故事閱讀 40,039評論 3 316
  • 文/蒙蒙 一浪南、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧漱受,春花似錦络凿、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,798評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至紧憾,卻和暖如春到千,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背赴穗。 一陣腳步聲響...
    開封第一講書人閱讀 32,027評論 1 266
  • 我被黑心中介騙來泰國打工憔四, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留膀息,地道東北人。 一個月前我還...
    沈念sama閱讀 46,488評論 2 361
  • 正文 我出身青樓了赵,卻偏偏與公主長得像潜支,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子柿汛,可洞房花燭夜當晚...
    茶點故事閱讀 43,612評論 2 350

推薦閱讀更多精彩內容

  • 22年12月更新:個人網站關停冗酿,如果仍舊對舊教程有興趣參考 Github 的markdown內容[https://...
    tangyefei閱讀 35,170評論 22 257
  • 第三章 模板 序 為什么要分離 易于維護的代碼,關鍵在于保持簡單的結構络断。而我們之前編寫的hello.py雖然簡單裁替,...
    科幻經典閱讀 1,529評論 0 6
  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn)貌笨,斷路器弱判,智...
    卡卡羅2017閱讀 134,637評論 18 139
  • 渲染模板 模板文件后綴名是 .html, 這些文件就是普通的 html 文件加上一些占位符變量, 它們都默認存放在...
    焉知非魚閱讀 687評論 0 1
  • 第三章 模板(Templates) 編寫易于維護的程序的要點在于書寫干凈锥惋、良好結構的代碼昌腰。你以前所見的代碼都過于...
    易木成華閱讀 1,123評論 0 2