Flask 模板繼承

2021-08-11 10:11 更新

Jinja 最為強大的地方在于他的模板繼承功能,模板繼承允許你創(chuàng)建一個基礎(chǔ)的骨架模板, 這個模板包含您網(wǎng)站的通用元素,并且定義子模板可以重載的 blocks

聽起來雖然復(fù)雜,但是其實非常初級。理解概念的最好方法就是通過例子。

基礎(chǔ)模板

在這個叫做 layout.html 的模板中定義了一個簡單的 HTML 文檔骨架,你可以 將這個骨架用作一個簡單的雙欄頁面。而子模板負(fù)責(zé)填充空白的 block:

<!doctype html>
<html>
  <head>
    {% block head %}
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
    <title>{% block title %}{% endblock %} - My Webpage</title>
    {% endblock %}
  </head>
<body>
  <div id="content">{% block content %}{% endblock %}</div>
  <div id="footer">
    {% block footer %}
    &copy; Copyright 2010 by <a  rel="external nofollow" target="_blank" >you</a>.
    {% endblock %}
  </div>
</body>

在這個例子中,使用 {% block %} 標(biāo)簽定義了四個子模板可以重載的塊。 block 標(biāo)簽所做的的所有事情就是告訴模板引擎: 一個子模板可能會重寫父模板的這個部分。

子模板

子模板看起來像這個樣子:

{% extends "layout.html" %}
{% block title %}Index{% endblock %}
{% block head %}
  {{ super() }}
  <style type="text/css">
    .important { color: #336699; }
  </style>
{% endblock %}
{% block content %}
  <h1>Index</h1>
  <p class="important">
    Welcome on my awesome homepage.
{% endblock %}

{% extends %} 是這個例子的關(guān)鍵,它會告訴模板引擎這個模板繼承自另一個模板的, 模板引擎分析這個模板時首先會定位其父父模板。extends 標(biāo)簽必須是模板的首個標(biāo)簽。 想要渲染父模板中的模板需要使用 {{ super() }}。

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號