模板繼承
- 模板繼承可以減少頁(yè)面內(nèi)容的重復(fù)定義，實(shí)現(xiàn)頁(yè)面內(nèi)容的重用
- 典型應(yīng)用：網(wǎng)站的頭部、尾部是一樣的沪伙，這些內(nèi)容可以定義在父模板中瓮顽，子模板不需要重復(fù)定義
- block標(biāo)簽：在父模板中預(yù)留區(qū)域，在子模板中填充
- extends繼承：繼承围橡，寫(xiě)在模板文件的第一行
- 定義父模板base.html
{ %block block_name%}
這里可以定義默認(rèn)值
如果不定義默認(rèn)值暖混，則表示空字符串
{ %endblock%}
- 定義子模板index.html
{ % extends "base.html" %}
- 在子模板中使用block填充預(yù)留區(qū)域
{ %block block_name%}
實(shí)際填充內(nèi)容
{ %endblock%}
說(shuō)明
- 如果在模版中使用extends標(biāo)簽，它必須是模版中的第一個(gè)標(biāo)簽
- 不能在一個(gè)模版中定義多個(gè)相同名字的block標(biāo)簽
- 子模版不必定義全部父模版中的blocks翁授，如果子模版沒(méi)有定義block拣播，則使用了父模版中的默認(rèn)值
- 如果發(fā)現(xiàn)在模板中大量的復(fù)制內(nèi)容，那就應(yīng)該把內(nèi)容移動(dòng)到父模板中
- 使用可以獲取父模板中block的內(nèi)容
- 為了更好的可讀性收擦，可以給endblock標(biāo)簽一個(gè)名字
{ % block block_name %}
區(qū)域內(nèi)容
{ % endblock block_name %}
三層繼承結(jié)構(gòu)
- 三層繼承結(jié)構(gòu)使代碼得到最大程度的復(fù)用贮配，并且使得添加內(nèi)容更加簡(jiǎn)單
- 如下圖為常見(jiàn)的電商頁(yè)面
day47_Django模板-01.png
1.創(chuàng)建根級(jí)模板
- 名稱為“base.html”
- 存放整個(gè)站點(diǎn)共用的內(nèi)容
<!DOCTYPE html>
<html>
<head>
<title>{%block title%}{%endblock%} 水果超市</title>
</head>
<body>
top--{{logo}}
<hr/>
{%block left%}{%endblock%}
{%block content%}{%endblock%}
<hr/>
bottom
</body>
</html>
2.創(chuàng)建分支模版
- 繼承自base.html
- 名為“base_***.html”
- 定義特定分支共用的內(nèi)容
- 定義base_goods.html
{%extends 'temtest/base.html'%}
{%block title%}商品{%endblock%}
{%block left%}
<h1>goods left</h1>
{%endblock%}
- 定義base_user.html
{%extends 'temtest/base.html'%}
{%block title%}用戶中心{%endblock%}
{%block left%}
<font color='blue'>user left</font>
{%endblock%}
- 定義index.html，繼承自base.html塞赂，不需要寫(xiě)left塊
{%extends 'temtest/base.html'%}
{%block content%}
首頁(yè)內(nèi)容
{%endblock content%}
3.為具體頁(yè)面創(chuàng)建模板泪勒，繼承自分支模板
- 定義商品列表頁(yè)goodslist.html
{%extends 'temtest/base_goods.html'%}
{%block content%}
商品正文列表
{%endblock content%}
- 定義用戶密碼頁(yè)userpwd.html
{%extends 'temtest/base_user.html'%}
{%block content%}
用戶密碼修改
{%endblock content%}
4.視圖調(diào)用具體頁(yè)面，并傳遞模板中需要的數(shù)據(jù)
- 首頁(yè)視圖index
logo='welcome to itcast'
def index(request):
return render(request, 'temtest/index.html', {'logo': logo})
- 商品列表視圖goodslist
def goodslist(request):
return render(request, 'temtest/goodslist.html', {'logo': logo})
- 用戶密碼視圖userpwd
def userpwd(request):
return render(request, 'temtest/userpwd.html', {'logo': logo})
5.配置url
from django.conf.urls import url
from . import views
urlpatterns = [
url(r'^$', views.index, name='index'),
url(r'^list/$', views.goodslist, name='list'),
url(r'^pwd/$', views.userpwd, name='pwd'),
]
