Django - 新增主模板

Django 支援模板繼承。Django 中的繼承概念與面向物件程式設計中的繼承非常相似。其思想是，即使每個檢視可能呈現不同的模板，Web 應用程式中每個檢視呈現的輸出也必須遵循統一的模式或外觀。

假設一個 Django 應用註冊了三個 URL 路由和三個檢視。我們希望以這樣的方式設計模板：每個檢視都應該有一個頁面標題、一個頁尾和一個帶有連結的側邊欄，以及在其右側顯示的可變內容。

主模板

在任何面嚮物件語言（例如 Python）中，**基類**定義屬性和方法，並使它們可用於繼承類。同樣，我們需要設計一個**主模板**，為其他模板提供整體框架。

**主模板**（有時稱為“基本模板”）除了提供通用結構外，還標記了虛擬塊。子模板繼承通用結構並覆蓋這些塊以提供相應的內容。這些塊用“**block – endblock**”結構標記。

{% block block_name %}
   ...
   ...
{% endblock %}

主模板在不同位置可能有多個這樣的塊。每個塊都應該提供一個唯一的識別符號。

主模板 (**base.html**) 的 HTML 程式碼如下：

<!doctype html>
<html>
<body>
   <!--header-->
   <div style="height:10%;">
      <h2 align="center">My Web Application</h2>
      <hr>
   </div>
   <div style="width:100%;">
      <!—side bar-->
      <div style="width:20%; float:left; border-right-style:groove">
         <ul>
            <b>
               <li><a href="">home</a></li>
               <li><a href="register/">register</a></li>
               <li><a href="login/">login</a></li>
            </b>
         </ul>
      </div>
      <!--contents-->
      <div style="margin-left:21%;">
         <p>
            {% block contents %}
            {% endblock %}
         </p>
      </div>
   </div>
   <br><br><br>
   <!--footer-->
   <hr>
   <div>
      <h4 align="right">All rights reserved</h4>
   </div>
</body>
</html>

首頁模板 (**index.html**) 透過以下標籤繼承此 **base.html**：

{% extends "base.html" %}

它用自己的內容填充虛擬內容塊：

<!doctype html>
<html>
<body>
   {% extends "base.html" %}
   {% block contents %}
      <h2 align="center">This is Home page</h2>
   {% endblock %}
</body>
</html>

定義檢視

讓我們定義一個呈現此模板的檢視：

from django.http import HttpResponse
from django.shortcuts import render

# Create your views here.
def index(request):
   return render(request, "index.html", {})

註冊檢視

我們還需要在 **urls.py** 中註冊此檢視：

urlpatterns = [
   ...,
   path('home/', views.index, name='home'),
]

當開啟 **https://:8000/myapp/home** URL 時，將呈現首頁模板，其中包含在 **base.html** 中設計的標題、側邊欄和頁尾：

列印頁面