摘要:控制結構條件控制語句循環還支持宏。宏類似于代碼中的函數。在指令之后,基模板中的個塊被重新定義,模板引擎會將其插入適當的位置。初始化之后,就可以在程序中使用一個包含所有文件的基模板。之前版本的模板中的歡迎信息,現在就放在這個頁面頭部。
四、模板
FMTV F:form表單 M:Model模型(數據庫) T:Template模板 V:view視圖(路由)1、渲染模板
模板是一個包含響應文本的文件,其中包含用占位變量表示的動態部分,其具體值 只在請求的上下文中才能知道。 使用真實值替換變量,再返回最終得到的響應字符 串,這一過程稱為渲染。可以使用 render_template() 方法來渲染模板。你需要做 的一切就是將模板名和你想作為關鍵字的參數傳入模板的變量。 Flask 會在 templates 文件夾里尋找模板。所以,如果你的應用是個模塊,這個文 件夾應該與模塊同級;如果它是一個包,那么這個文件夾作為包的子目錄: 模板:
/application.py /templates /hello.html
包:
/application /__init__.py /templates /hello.html
【hello.html】
Hello World!
from flask import render_template @app.route("/hellotemplate/") def hellotemplate(): return render_template("hello.html")
模板引擎
Flask使用了一個名為 Jinja2 的強大模板引擎
{% ... %} Jinja語句,例如判斷、循環語句
{{ ... }} 變量,會顯示在瀏覽器中
{# ... #} 注釋,不會輸出到瀏覽器中
2、變量規則在模板中使用的 {{ name }} 結構表示一個變量,它是一種特殊的占位符,告訴
模板引擎這個位置的值從渲染模板時使用的數據中獲取。
【helloname.html】
Hello, {{ name }}!
@app.route("/hellotemplate/") def helloname(name): return render_template("helloname.html",name = name)
可以使用過濾器修改變量,過濾器名添加在變量名之后,中間使用豎線分隔。
3、控制結構1、條件控制語句
【if.html】
{% if name %} hello, {{name}} {% else %} hello, world! {% endif %}
2、 for 循環
【for.html】
{% for a in range(10) %}
@app.route("/for/") def fortemplate(): return render_template("for.html")- a
{% endfor %}
3、Jinja2 還支持宏(macro) 。宏類似于 Python 代碼中的函數(def)。
【macro.html】
{% macro myprint(A) %} this is {{ A }} {% endmacro %} {{ myprint(A) }} @app.route("/macro/") def macrotamplate(a): return render_template("macro.html",A = a)
為了重復使用宏,我們可以將其保存在多帶帶的文件中,然后在需要使用的模板中導入:
【macro2.html】
{% from "macro.html" import myprint %} {{ myprint(A) }} @app.route("/macro2/") def macro2template(a): return render_template("macro2.html",A = a)
4、包含(include)
【include.html】
{% include "macro.html" %} @app.route("/include/") def includetemplate(a): return render_template("include.html",A = a)
【注意】
包含進來的文件里的所有變量也包含進來了,需要在視圖函數中指定
首先,創建一個名為 base.html 的基模板:
【base.html】
{% block head %}{% block title %} {% endblock %} - My Application {% endblock %} {% block body %} {% endblock %}
block 標簽定義的元素可在衍生模板中修改。下面這個示例是基模板的衍生模板:
【extend.html】
% extends "base.html" %} {% block title %}Index{% endblock %} {% block head %} {{ super() }}super
{% endblock %} {% block body %}Hello, World!
{% endblock %}
extends 指令聲明這個模板衍生自 base.html。在 extends 指令之后,基模板中的 3個塊被重新定義,模板引擎會將其插入適當的位置。如果想添加內容到在父模板 內已經定義的塊,又不想失去父模板里的內容,可以使用super函數5、使用Flask-Bootstrap
Flask-Bootstrap 使用 pip安裝:
(venv) $ pip install flask-bootstrap
Flask 擴展一般都在創建程序實例后就初始化。
初始化 Flask-Bootstrap 之后,就可以在程序中使用一個包含所有 Bootstrap 文件
的基模板。
【boootstrap.html】
{% extends "bootstrap/base.html" %} {% block title %}Flasky{% endblock %} {% block navbar %}{% endblock %} {% block content %}{% endblock %}Hello, {{ name }}!
Jinja2 中的 extends 指令從 Flask-Bootstrap 中導入 bootstrap/base.html,從而 實現模板繼承。 Flask-Bootstrap 中的基模板提供了一個網頁框架,引入了 Bootstrap 中的所有 CSS 和JavaScript 文件。基模板中定義了可在衍生模板中重定義的塊。 block 和 endblock 指令定義的塊中的內容可添加到基模板中。 上面這個 boootstrap.html 模板定義了 3 個塊,分別名為 title、 navbar 和 content。 這些塊都是基模板提供的, 可在衍生模板中重新定義。 title 塊的作用很明顯,其中 的內容會出現在渲染后的 HTML 文檔頭部,放在標簽中。 navbar 和 content 這兩個塊分別表示頁面中的導航條和主體內容。在這個模板中, navbar 塊使用 Bootstrap 組件定義了一個簡單的導航條。content 塊中有個 容器,其中包含一個頁面頭部。 之前版本的模板中的歡迎信息,現在就放在這個頁面頭部。from flask_bootstrap import Bootstrap bootstrap = Bootstrap(app) @app.route("/bootstrap/") def bootstraptemplate(name): return render_template("boootstrap.html",name = name) 【注意】
很多塊都是 Flask-Bootstrap 自用的,如果直接重定義可能會導致一些問題。例如,
Bootstrap 所需的文件在 styles 和 scripts 塊中聲明。如果程序需要向已經有內
容的塊中添加新內容,必須使用Jinja2 提供的 super() 函數。例如,如果要在衍生
模板中添加新的 JavaScript 文件,需要這么定義 scripts 塊:{% block scripts %} {{ super() }} {% endblock %}6、自定義錯誤頁面【templates/404.html】
Page is not Found
@app.errorhandler(404) def page_not_found(e): return render_template("404.html"), 404【templates/base.html: 包含導航條的程序基模板】
{% extends "bootstrap/base.html" %} {% block title %}Flasky{% endblock %} {% block head %} {{ super() }} {% endblock %} {% block navbar %}{% endblock %} {% block content %}{% block page_content %}{% endblock %}{% endblock %} {% block scripts %} {{ super() }} {{ moment.include_moment() }} {% endblock %}這個模板的 content 塊中只有一個
容器,其中包含了一個名為
page_content 的新的空塊,塊中的內容由衍生模板定義。【templates/404.html:使用模板繼承機制自定義 404 錯誤頁面】
{% extends "base.html" %} {% block title %}Flasky - Page Not Found{% endblock %} {% block page_content %}{% endblock %}Not Found
templates/boootstrap.html 現在可以通過繼承這個基模板來簡化內容:
【 templates/boootstrap.html: 使用模板繼承機制簡化頁面模板】{% extends "base.html" %} {% block title %}Flasky{% endblock %} {% block page_content %}7、靜態文件{% endblock %}Hello, {{ name }}!
默認設置下, Flask 在程序根目錄中名為 static 的子目錄中尋找靜態文件。
如果需要,可在static 文件夾中使用子文件夾存放文件。給靜態文件生成
URL ,使用特殊的 "static" 端點名:
【westeros.html】@app.route("/westeros/") def westeros(): return render_template("westeros.html")這個文件應該存儲在文件系統上的 static/westeros.jpg 。
8、使用Flask-Moment本地化日期和時間lask-Moment 是一個 Flask 程序擴展,能把moment.js 集成到 Jinja2 模
板中。 Flask-Moment 可以使用 pip 安裝:(venv) $ pip install flask-moment這個擴展的初始化方法和Bootstrap一樣,以程序實例app為參數:
from flask_moment import Moment moment = Moment(app)除了 moment.js, Flask-Moment 還依賴 jquery.js。要在 HTML 文檔的某個
地方引入這兩個庫,可以直接引入,這樣可以選擇使用哪個版本,也可使用擴
展提供的輔助函數,從內容分發網絡(Content Delivery Network, CDN)中
引入通過測試的版本。 Bootstrap 已經引入了 jquery.js, 因此只需引入
moment.js即可。
【base.html中增加了】{% block scripts %} {{ super() }} {{ moment.include_moment() }} {% endblock %}【moment.html】
{% extends "base.html" %} {% block page_content %}Hello World!
The local date and time is {{moment(current_time).format("LLL")}}.
That was {{moment(current_time).fromNow(refresh = true)}}.
{% endblock %}把變量current_time 傳入模板進行渲染
from datetime import datetime @app.route("/moment/") def momenttemplate(): return render_template("moment.html",current_time = datetime.utcnow())文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/40796.html
相關文章
發表評論
0條評論
閱讀 982·2023-04-26 01:47
閱讀 1672·2021-11-18 13:19
閱讀 2042·2019-08-30 15:44
閱讀 645·2019-08-30 15:44
閱讀 2291·2019-08-30 15:44
閱讀 1232·2019-08-30 14:06
閱讀 1420·2019-08-30 12:59
閱讀 1900·2019-08-29 12:49