
## 模版結構優化
### 引入模版
有時候一些代碼是在許多模版中都用到的。如果我們每次都重復的去拷貝代碼那肯定不符合項目的規范。一般我們可以把這些重復性的代碼抽取出來,就類似于Python中的函數一樣,以后想要使用這些代碼的時候,就通過include包含進來。這個標簽就是include。
```
# header.html
<p>我是header</p>
# footer.html
<p>我是footer</p>
# main.html
{% include 'header.html' %}
<p>我是main內容</p>
{% include 'footer.html' %}
```
include標簽尋找路徑的方式。也是跟render渲染模板的函數是一樣的。
默認include標簽包含模版,會自動的使用主模版中的上下文,也即可以自動的使用主模版中的變量。如果想傳入一些其他的參數,那么可以使用with語句
```
# header.html
<p>用戶名:{{ username }}</p>
# main.html
{% include "header.html" with username='juran' %}
```
### 模板繼承
在前端頁面開發中。有些代碼是需要重復使用的。這種情況可以使用include標簽來實現。也可以使用另外一個比較強大的方式來實現,那就是模版繼承。模版繼承類似于Python中的類,在父類中可以先定義好一些變量和方法,然后在子類中實現。模版繼承也可以在父模版中先定義好一些子模版需要用到的代碼,然后子模版直接繼承就可以了。并且因為子模版肯定有自己的不同代碼,因此可以在父模版中定義一個block接口,然后子模版再去實現。
```
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="{% static 'style.css' %}" />
<title>{% block title %}我的站點{% endblock %}</title>
</head>
<body>
<div id="sidebar">
{% block sidebar %}
<ul>
<li><a href="/">首頁</a></li>
<li><a href="/blog/">博客</a></li>
</ul>
{% endblock %}
</div>
<div id="content">
{% block content %}{% endblock %}
</div>
</body>
</html>
```
這個模版,我們取名叫做base.html,定義好一個簡單的html骨架,然后定義好兩個block接口,讓子模版來根據具體需求來實現。子模板然后通過extends標簽來實現.
```
{% extends "base.html" %}
{% block title %}博客列表{% endblock %}
{% block content %}
{% for entry in blog_entries %}
<h2>{{ entry.title }}</h2>
<p>{{ entry.body }}</p>
{% endfor %}
{% endblock %}
```
需要注意的是:extends標簽必須放在模版的第一行。
子模板中的代碼必須放在block中,否則將不會被渲染。
如果在某個block中需要使用父模版的內容,那么可以使用{{block.super}}來繼承。比如上例,{%block title%},如果想要使用父模版的title,那么可以在子模版的title block中使用{{ block.super }}來實現。
在定義block的時候,除了在block開始的地方定義這個block的名字,還可以在block結束的時候定義名字。比如{% block title %}{% endblock title %}。這在大型模版中顯得尤其有用,能讓你快速的看到block包含在哪里。
- 空白目錄
- 1-Django前導知識
- 1-1-虛擬環境
- 1-2-Django框架介紹與環境搭建
- 2-URL與視圖
- 2-1-URL與視圖
- 3-模板
- 3-1-模板介紹
- 3-2-模板變量
- 3-3-常用標簽
- 3-4-模板常用過濾器
- 3-5-模板結構優化
- 3-6-加載靜態文件
- 4-數據庫
- 4-1-操作數據庫
- 4-2-圖書管理系統
- 4-3-ORM模型介紹
- 4-4-ORM模型的增刪改查
- 4-5-模型常用屬性
- 4-6-外鍵和表
- 4-7-查詢操作
- 4-8-QuerySet的方法
- 4-9-ORM模型練習
- 4-10-ORM模型遷移
- 5-視圖高級
- 1-Django限制請求method
- 2-頁面重定向
- 3-HttpRequest對象
- 4-HttpResponse對象
- 5-類視圖
- 6-錯誤處理
- 6-表單
- 1-用表單驗證數據
- 2-ModelForm
- 3-文件上傳
- 7-session和cookie
- 1-session和cookie
- 8-memcached
- 1-memcached
- 9-阿里云部署
- 阿里云部署