搭建自己的博客（三）：簡單搭建首頁和詳情頁
阿新 • • 發佈：2018-11-04
title lose add 刷新 cti you urn http eight 
上一篇我們創建了博客表和標簽表以及超級用戶，那如何將創建的博客通過網頁顯示出來呢？‘我們簡單的創建首頁和詳情頁。
1、新建html界面
首先創建在blog app下創建一個templates文件夾，這個文件夾用來放置前端頁面，註意文件夾名字必須是templates。
創建blog_list.html 文件用來放博客列表。創建blog_detail.html文件用來放博客詳情。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>blog_list.htmlfelix Blog</title> </head> <body> <div> <h3>felix Blog</h3> </div> <br/> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>博客詳情</title> </head>blog_detail.html<body> </body> </html>
2、創建是視圖函數
打開blog下的views.py
from django.shortcuts import render_to_response, get_object_or_404 from .models import Blog # Create your views here. # 博客列表 def blog_list(requests): context = { ‘blogs‘: Blog.objects.all() }views.pyreturn render_to_response(‘blog_list.html‘, context) # 博客詳情 def blog_detail(requests, blog_pk): context = { ‘blog‘: get_object_or_404(Blog, pk=blog_pk) } return render_to_response(‘blog_detail.html‘, context)
這裏視圖函數中傳遞了參數給前端，所以得修改一下之前寫的前端代碼，渲染視圖函數傳遞過來的數據。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>felix Blog</title> </head> <body> <div> <h3>felix Blog</h3> </div> <br/> {% for blog in blogs %} <a href="{% url ‘blog_detail‘ blog.pk %}"><h3>{{ blog.title }}</h3></a> <p>{{ blog.content }}</p> {% endfor %} </body> </html>blog_list.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{{ blog.title }}</title> </head> <body> <a href="{% url ‘home‘ %}"> <div> <h3>felix Blog</h3> </div> </a> <h3>{{ blog.title }}</h3> <p>{{ blog.content }}</p> </body> </html>blog_detail
3、創建url訪問路徑
修改全局的myblog下的urls.py
"""myblog URL Configuration The `urlpatterns` list routes URLs to views. For more information please see: https://docs.djangoproject.com/en/2.1/topics/http/urls/ Examples: Function views 1. Add an import: from my_app import views 2. Add a URL to urlpatterns: path(‘‘, views.home, name=‘home‘) Class-based views 1. Add an import: from other_app.views import Home 2. Add a URL to urlpatterns: path(‘‘, Home.as_view(), name=‘home‘) Including another URLconf 1. Import the include() function: from django.urls import include, path 2. Add a URL to urlpatterns: path(‘blog/‘, include(‘blog.urls‘)) """ from django.contrib import admin from django.urls import path, include from blog.views import blog_list urlpatterns = [ path(‘‘, blog_list, name=‘home‘), # 主頁路徑 path(‘admin/‘, admin.site.urls), path(‘blog/‘, include(‘blog.urls‘)), # 博客app路徑 ]myblog_urls.py
在blog app下創建url路徑，新建urls.py
from django.urls import path from . import views urlpatterns = [ path(‘<int:blog_pk>‘,views.blog_detail,name=‘blog_detail‘) ]blog_urls.py
4、啟動服務，運行測試
此時我們在瀏覽器輸入：http://127.0.0.1:8000/
點擊myBlog，跳轉到詳情：
如果沒有數據的話，我們可以進入admin後臺管理系統創建。
然後刷新首頁：
就出現了剛才創建的博客！
搭建自己的博客（三）：簡單搭建首頁和詳情頁