一、模板簡介
- 爲了更好的維護和展示頁面數據,使用直接返回數據顯然是呆板的,不夠美觀,不夠靈活,所以要使用模板。
- 模板一般都放到項目根目錄下的templates文件夾裏。模板包含一些基礎的HTML代碼和一些特殊的語法,通過特殊的語法將數據動態的插入HTML頁面中。
-
特殊的語法中有一些變量和標籤。模板變量由視圖函數生成的,然後通過上下文傳遞到模板裏,由瀏覽器渲染出來。
二、模板使用方法
1)首先在同項目名目錄下配置模板路徑
在myblog/settings.py >> templates裏的dirs
TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [os.path.join(BASE_DIR, 'templates')], 'APP_DIRS': True, 'OPTIONS': { 'context_processors': [ 'django.template.context_processors.debug', 'django.template.context_processors.request', 'django.contrib.auth.context_processors.auth', 'django.contrib.messages.context_processors.messages', ], }, }, ]
2) 增加url規則
myblog/urls.py 》》 增加view.index
urlpatterns = [ ... path('', views.index), ]
3)不同數據類型的操作實例
a. 變量
blog/views.py
def index(request): sitename = '白灰博客' url = 'www.baihui.com' # 把兩個變量封裝到上下文裏 context = { 'sitename': sitename, 'url': url, } # 把上下文傳遞到模板裏
return render(request, 'index.html', context)
myblog根目錄創建templates文件夾,下面再建一個index.html ,刷新頁面查看首頁渲染結果。變量需要用雙大括號 {{ 變量名}} 來顯示
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>MyBlog</title> </head> <body> <h2>網站:{{ sitename }}</h2> <h2>域名:{{ url }}</h2> </body> </html>
b. 列表
blog/views.py
def index(request): sitename = '白灰博客' url = 'www.baihui.com' # 新加一個列表 list = [ '測試數據1', '測試數據2', '測試數據3', '測試數據4', '測試數據5', ] # 把兩個變量封裝到上下文裏 context = { 'sitename': sitename, 'url': url, 'list2': list, } # 把上下文傳遞到模板裏 return render(request, 'index.html', context)
注意上面的list2是content的key,模板引用的就是這個key list2,不是上面的變量名list。
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>MyBlog</title> </head> <body> <h2>網站:{{ sitename }}</h2> <h2>域名:{{ url }}</h2> {#新加代碼#} <div> <ul> <h4>測試數據列表:</h4> {% for list in list2 %} <li>{{ list }}</li> {% endfor %} </ul> </div> </body> </html>
c. 字典
def index(request): sitename = '白灰博客' url = 'www.baihui.com' list = [ '測試數據1', '測試數據2', '測試數據3', '測試數據4', '測試數據5', ] myinfo = { 'name': 'baihui', 'addr': 'beijing', 'age': 33, 'sex': 'm', 'as name': 'robin', } context = { 'sitename': sitename, 'url': url, 'list2': list, 'info': myinfo, } # 把上下文傳遞到模板裏 return render(request, 'index.html', context)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>MyBlog</title> </head> <body> <h2>網站:{{ sitename }}</h2> <h2>域名:{{ url }}</h2> {#新加代碼#} <div> <ul> <h4>測試數據列表:</h4> {% for list in list2 %} <li>{{ list }}</li> {% endfor %} </ul> </div> <div> <ul> <h3>我的個人信息</h3> {% for k,v in info.items %} <li>{{k}} : {{v}}</li> {% endfor %} </ul> </div> </body> </
最終結果如下