【flask】flask render_template 用法


我們之前的視圖函數,返回的都是簡單的'Hello Wolrd'之類的字符串,怎么返回一個html呢?首先我們在templates文件夾建立一個html文件,內容隨便寫一點如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Index</title>
</head>
<body>
<h1>This is index page</h1>
</body>
</html>

我們可以使用Flask對象appsend_static_file方法,使視圖函數返回一個靜態的html文件,但現在我們不使用這種方法,而是使用flaskrender_template函數,它功能更強大。
flask中導入render_template,整體代碼如下:

from flask import Flask, render_template
import config

app = Flask(__name__)
app.config.from_object(config)


@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run()

render_template函數會自動在templates文件夾中找到對應的html,因此我們不用寫完整的html文件路徑。用瀏覽器訪問'/'這個地址,顯示結果如下:

clipboard.png

那么為何稱之為模板呢?因為render_template不僅能渲染靜態的html文件,也能傳遞參數給html,使一個html模板根據參數的不同顯示不同的內容,這是因為flask使用了jinja2這個模板引擎。要使用模板,在render_template參數中以key=value形式傳入變量,在html中使用{{key}}來顯示傳入的變量,例如:

# 視圖函數
@app.route('/')
def index():
    return render_template('index.html', contents='This is index page')

# html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Index</title>
</head>
<body>
<h1>{{ contents }}</h1>
</body>
</html>    

瀏覽器顯示的結果與上文是一樣的。我們還可以直接把一個類的實例傳遞過去,並在模板中訪問類的屬性,例如假設一個類對象objab屬性,關鍵部分的代碼如下:

# 視圖函數中
return render_template('index.html', object=obj)

...
# html中
<p>a: {{ object.a }}</p>
<p>b: {{ object.b }}</p>

傳入一個字典也可以,並且在模板中既可以用dict[key],也可以用dict.key


使用過濾器,可以在html中對傳入的變量進行處理,其格式是{{ 變量 | 過濾器 }},例如將前文的{{ contents }}修改為{{ contents | upper}},瀏覽器顯示的內容就變成了:

clipboard.png

所以我們可以很容易就理解,過濾器其實就是以變量為參數的函數,返回處理后的結果,在后端一樣可以先用字符串對象的upper()函數處理好再傳遞給模板,效果是完全一樣的。jinja2自帶了一些過濾器,例如length/reverse/lower等等 ,並且我們也可以自己按照需求自定義過濾器,模板還支持{{ 變量 | 過濾器1 | 過濾器2 | ... }}這樣的操作。想要深入了解的話,可以搜索jinja2過濾器去進一步學習。


模板中還可以使用if elsefor in控制語句,與變量使用{{ }}不同,控制語句要放在{% %}里,例如前文的contents傳入一個list:

contents=[i for i in range(10)]

html中代碼如下:

<h1>
    {% for i in contents %}
        {{ i }}{# 注意i也要用兩個大括號 #}
    {% endfor %}
</h1>

使用for遍歷contents的內容,並用{{ i }}顯示出來,同時還用{# #}加了一個注釋,還要注意需要使用{% endfor %}來提示循環區域的結束,因為html不像python那樣通過縮進來判斷循環的區域,if也是同理。瀏覽器顯示結果:

clipboard.png

最后forif結合使用:

<h1>header</h1>
    {% for i in contents %}
        <p>
        {% if i%2 == 0 %}
            {{ i }}是偶數{# 注意i也要用兩個大括號 #}
        {% else %}
            {{ i }}是奇數
        {% endif %}
        </p>
    {% endfor %}

結果如下(只是演示一下,不要吐槽排版和美觀):

clipboard.png


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM