Django 用模板來節省公共代碼,
阿新 • • 發佈：2017-12-28
sadd base eat render con 區域 style path html
如果我們有一個後臺網站,或者顯示個人信息的網站 標題logo,邊框等信息的代碼都是固定的,只有部分區域是改變,
我們如果用Django來寫html的話就會重復代碼.這時候我們只要用模板的方式把需要改變的代碼塊引入,
增加項目的時候也只需要增加需要插入的代碼即可
如下圖我們要寫一個類似的網頁:
點擊已購商品時會出現:
點擊購物車後會出現:
:
左側菜單是用A標簽來寫的鏈接,如果正常來寫,我們有幾個鏈接就要寫幾個基本內容相同的網頁,只是棕色的顯示區域內容不同.現在我們有新的寫法去改變這一現象:
1 首先我們寫一個HTML叫base.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .head{ height: 50px;background-color: steelblue;text-align: center;color: red;font-size: 22px; } .center{ height:800px; } .left{ width: 25%;background-color: tan;height: 800px;float: left; } .left a{display: block;color: black;font-size: 22px} .right{ width: 75%;background-color: saddlebrown;height: 800px;float: left; } .button{ height: 50px;background-color: steelblue; } .buy{ color: darkkhaki;font-size: 30px; } </style> </head> <body> <div class="head">我的購物信息</div> <div class="center"> <div class="left"> <a href="/buy/">已購商品</a> <a href="/shoppingcar/">購物車</a> <a href="/collection/">收藏夾</a> </div> <div class="right"> {% block rightbox %} {% endblock %} </div> </div> <div class="button">底部欄</div> </body> </html>
這裏我們發現
這裏的代碼什麽都沒有多了個{% block rightbox %} 和 {% endblock %} 這就是固定的格式,告訴我們將要把需要引入的代碼放入這裏 , rightbox 是我們區分代碼塊起的名字
而這個base.html就是我們的模板網頁,我們並不直接訪問這個網頁
2 我們的左側菜單裏有已購商品 ,購物車,收藏夾,那麽我們就需要有3個html文檔
現在我們給已購商品寫一個buy.html,看看要怎麽寫:
我們在模板base.html裏用了
所以我們還要去寫views 和urls裏去寫其他的代碼:
1 from django.shortcuts import render,HttpResponse 2 3 # Create your views here. 4 5 def buy(req): 6 return render(req,"buy.html") 7 8 def base(req): 9 return render(req,"base.html") 10 11 def collection(req): 12 return render(req, "collection.html") 13 14 def shoppingcar(req): 15 return render(req,"shoppingcar.html") 16 17 def mod(req): 18 return render(req,"mod.html")
1 from django.contrib import admin 2 from django.urls import path 3 from t_app import views 4 5 urlpatterns = [ 6 path(‘admin/‘, admin.site.urls), 7 path(r‘buy/‘, views.buy), 8 path(r‘base/‘, views.base), 9 path(r‘shoppingcar/‘, views.shoppingcar), 10 path(r‘mod/‘, views.mod), 11 path(r‘collection/‘, views.mod), 12 13 ]
Django 用模板來節省公共代碼,