在一般的 Web 程序里，訪問一個地址通常會返回一個包含各類信息的 HTML 頁面。因為我們的程序是動態(tài)的，頁面中的某些信息需要根據(jù)不同的情況來進(jìn)行調(diào)整，比如對登錄和未登錄用戶顯示不同的信息，所以頁面需要在用戶訪問時根據(jù)程序邏輯動態(tài)生成。
我們把包含變量和運(yùn)算邏輯的 HTML 或其他格式的文本叫做模板，執(zhí)行這些變量替換和邏輯計算工作的過程被稱為渲染（模板渲染引擎——Jinja2）。
按照默認(rèn)的設(shè)置，F(xiàn)lask 會從程序?qū)嵗谀K同級目錄的 templates 文件夾中尋找模板。
模板基本語法
在模板里，你需要添加特定的定界符將 Jinja2 語句和變量標(biāo)記出來
下面是三種常用的定界符：
1、{{ … }} 用來標(biāo)記變量。
2、{% … %} 用來標(biāo)記語句，比如 if 語句，for 語句等。
3、{# … #} 用來寫注釋。
模板中使用的變量需要在渲染的時候傳遞進(jìn)去。
編寫主頁模板
我們先在 templates 目錄下創(chuàng)建一個 movie.html 文件，作為主頁模板。主頁需要顯示電影條目列表和個人信息，代碼如下所示：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>movie list</title></head><body> {# 使用 length 過濾器獲取 movies 變量的長度 #} <p>{{ movies|length }} Titles</p> <ul> {% for movie in movies %} {# 迭代 movies 變量 #} <li>{{ movie.title }} - {{ movie.year }}</li> {# 等同于 movie['title'] #} {% endfor %} {# 使用 endfor 標(biāo)簽結(jié)束 for 語句 #} </ul></body></html> |
為了方便對變量進(jìn)行處理，Jinja2 提供了一些過濾器（和Vue.js框架中的過濾器有著異曲同工之妙），語法形式如下：
{{ 變量|過濾器 }}
左側(cè)是變量，右側(cè)是過濾器名。比如，上面的模板里使用 length 過濾器來獲取movies 的長度，類似 Python 里的 len() 函數(shù)。
準(zhǔn)備虛擬數(shù)據(jù)
為了模擬頁面渲染，我們需要先創(chuàng)建一些虛擬數(shù)據(jù)，用來填充頁面內(nèi)容，其中template.py中定義虛擬數(shù)據(jù)。
|
1
|
movies = [{'title': '長津湖', 'year': '2021'},{'title': '送你一朵小紅花', 'year': '2021'}] |
渲染主頁模板
使用 render_template() 函數(shù)可以把模板渲染出來，必須傳入的參數(shù)為模板文件名（相對于 templates 根目錄的文件路徑），這里即 ‘movie.html' 。為了讓模板正確渲染，我們還要把模板內(nèi)部使用的變量通過關(guān)鍵字參數(shù)傳入這個函數(shù)，如下所示：
|
1
2
3
4
5
6
7
8
9
|
from flask import Flask, render_template app = Flask(__name__) @app.route('/')def movie(): return render_template('movie.html', movies=movies) if __name__ == "__main__": app.run() |
在傳入 render_template() 函數(shù)的關(guān)鍵字參數(shù)中，左邊的 movies 是模板中使用的變量名稱，右邊的movies 則是該變量指向的實際對象。這里傳入模板的movies 是列表，但能夠在模板里使用的不只這一種 Python數(shù)據(jù)結(jié)構(gòu)，你也可以傳入字符串、元組、字典、函數(shù)等。
render_template() 函數(shù)在調(diào)用時會識別并執(zhí)行 “movie.html” 里所有的 Jinja2 語句，返回渲染好的模板內(nèi)容。在返回的頁面中，變量會被替換為實際的值（包括定界符），語句（及定界符）則會在執(zhí)行后被移除（注釋也會一并移除）。
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注服務(wù)器之家的更多內(nèi)容！
原文鏈接：https://blog.csdn.net/julac/article/details/121267284
