橡皮擦，一個逗趣的互聯網高級網蟲，新的系列，讓我們一起進入 Django 世界，

滾雪球學 Python 第三輪

十九、微微型 CSDN 專案
- 19.1 補充知識之 Django 后臺模型方法篇
- - 19.1.1 save_model 方法
  - 19.1.2 delete_model 方法
  - 19.1.3 其余簡單方法
- 19.2 微型 CSDN 初始化
- 19.3 從導航欄開始
- - 19.3.1 靜態頁面渲染
- 19.4 本篇博客小節
- 繼續閱讀

十九、微微型 CSDN 專案

Django 框架的學習之旅還在繼續，預計再有 10 篇以上才可以封筆，果然框架系列專欄是最難寫的，

接下來的幾篇博客將基于 Django 框架完成一個微型的 CSDN 博客專案，要實作的核心功能是發布博客以及發布 Blink，還會實作博客中的評論與友情鏈接功能，

該專案特別適合作為大學期末專案，如果你看到了本專案，要好好把本專案制作程序學習完畢，對你非常有幫助，

簡單拆解該專案模塊：

用戶模塊；
文章與分類模塊；
Blink 模塊；
選單模塊；
友情鏈接模塊；
評論模塊，

19.1 補充知識之 Django 后臺模型方法篇

在上一篇博客中介紹了 Django 的后臺模型屬性，本篇博客涉及的專案開始前，需要先把后臺模型方法補充完整，

19.1.1 save_model 方法

重寫該方法得到的結果就是保存資料時，可以在資料入庫前進行細節處理，
方法原型如下：

def save_model(self, request, obj, form, change):
    """
    Given a model instance save it to the database.
    """
    obj.save()

其中 request 是 HttpRequest 實體，obj 是模型實體，form 表單傳遞進來的實體，change 是布林值，用來標記是新增資料還是更新資料，

    def save_model(self, request, obj, form, change):
        print(form)
        obj.name = "xxx"
        super().save_model(request, obj, form, change)

上述代碼不管前臺傳遞過來的是何值，最終 name 欄位得到都是 xxx，同時輸出 form 得到如下內容：

<tr>
  <th><label for="id_mobile">手機號碼:</label></th>
  <td>
    <input
      type="number"
      name="mobile"
      value="15407564444"
      class="vIntegerField"
      requi
      red
      id="id_mobile"
    />
  </td>
</tr>
<tr>
  <th><label for="id_name">客戶名:</label></th>
  <td>
    <input
      type="text"
      name="name"
      value="testr"
      class="vTextField"
      maxlength="20"
      require
      d
      id="id_name"
    />
  </td>
</tr>

可以看到這里是填寫的表單內容與 HTML 標簽，

19.1.2 delete_model 方法

重寫該方法可以在進行洗掉操作的時候，處理一些細節，

方法原型如下：

def delete_model(self, request, obj):
    """
    Given a model instance delete it from the database.
    """
    obj.delete()

該方法的呼叫依舊采用 super().delete_model() ，

19.1.3 其余簡單方法

get_readonly_fields 方法
回傳一組只讀欄位，

get_autocomplete_fields
回傳一組自動完成欄位，與 autocomplete_fields 使用方法一致，

get_prepopulated_fields
回傳一組自動填充欄位，

get_list_display
回傳表格欄位，與 list_display 一致，

get_list_display_links
回傳一組超鏈接顯示的欄位，

get_fields
回傳一組欄位，與 fields 一致，

其余更多方法不再進行羅列說明，除了官方手冊可以進行學習以外，還可以打開 Django 檔案夾下 admin 目錄中的 options.py 檔案，里面有這些方法的原型，

純粹學習 API 是沒有辦法掌握 Django 中所有內容的的，還是要把他們應用到專案中，

19.2 微型 CSDN 初始化

準備作業與復習作業完成之后，就可以對微型 CSDN 專案進行初始化操作了，創建專案，創建 APP，

django-admin startproject my_csdn
cd my_csdn
python manage.py startapp csdn

接下來在 csdn 檔案夾中創建一個 templates 目錄檔案，然后在該目錄中再嵌套一個 csdn 目錄，

按照常見專案結構，在創建一個前端檔案夾和一個后端檔案夾，分別是 frontend 和 backend，

相同目錄再創建一個 common.html 檔案，該檔案用于存放前后端通用的頁面代碼，

最終得到的目錄結構如下：

自己動手寫個微型 CSDN 吧，還能實作網頁版 Blink，No.1
在 common.html 中輸入如下代碼，重點關注 block 部分，

{% load static %}
<html>
<head>
    <title>{% block title %}{% endblock%}</title>
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}"/>
    <link rel="stylesheet" href="{% static 'css/main.css' %}"/>
    <script type="test/javascript" src="{% static 'js/jquery.min.js' %}"></script>
    <script type="test/javascript" src="{% static 'js/bootstrap.min.js' %}"></script>
    {% block ext_header %} {% endblock %}
</head>
<body>
{% block body %} {% endblock %}
</body>
{% block ext_js %} {% endblock %}
</html>

檔案中涉及的靜態檔案，提前存放到 static 檔案夾中，

自己動手寫個微型 CSDN 吧，還能實作網頁版 Blink，No.1
占位符分別如下：

{% block title %}{% endblock%}，網頁標題占位；
{% block ext_header %} {% endblock %}，網頁頭部內容占位；
{% block body %} {% endblock %}，網頁主體內容占位；
{% block ext_js %} {% endblock %}，網頁頁尾 JS 占位，

19.3 從導航欄開始

先通過一個前臺的導航欄，練練手，打通頁面之間的邏輯，

繼續在 frontend 目錄中創建靜態檔案，同時每個檔案的代碼都如下所示，

frontend_common.html

{% extends 'csdn/common.html' %} 
{% block title%}{% endblock %} 
{% block ext_header %} {% endblock %} 
{% block body %} 
{% include 'csdn/frontend/header.html' %}
<div class="main-page">
  <div class="container">
    <div class="row">
      <div class="col-md-9 left-content">{% block left %} {% endblock %}</div>
      <div class="col-md-3 right-content">主要內容區域</div>
    </div>
  </div>
</div>
{% block ext_js %} {% endblock %} 
{% endblock %}

header.html
該檔案是我從 BootStrap 官方直接復制過來的代碼段，為了實作選單功能，你可以自行修改，

<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">首頁</a></li>
        <li><a href="#">關于我們</a></li>
        <li><a href="#">聯系我們</a></li>
      </ul>
    </div>
    <!--/.nav-collapse -->
  </div>
</nav>

home.html

{% extends 'csdn/frontend/frontend_common.html' %} 
{% block title%} 微型CSDN {%endblock%} 
{% block ext_header %} {% endblock %} 
{% block left %} {% endblock%}

這部分主要掌握頁面之間的參考關系，home.html 檔案引入了 frontend_common.html，該檔案又引入了 header.html 和 csdn/common.html 檔案，

19.3.1 靜態頁面渲染

準備作業完成之后，就可以對頁面進行渲染了，首先在 csdn 目錄中新建一個 urls.py 路由檔案，代碼后面是目錄結構的截圖，

from django.urls import path
from . import views

urlpatterns = [
    path('', views.HomepageView.as_view(), name="home")
]

自己動手寫個微型 CSDN 吧，還能實作網頁版 Blink，No.1
配置完畢再修改專案路由，

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('csdn.urls'))
]

自己動手寫個微型 CSDN 吧，還能實作網頁版 Blink，No.1
同步 settings.py 檔案中增加對應用的引入，

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'csdn'
]

到這里已經完成大部分作業，撰寫程序中涉及的檔案較多，一定要細細梳理，很容易出錯，

此時在回過頭來看 csdn/urls.py 檔案，可以看到在該檔案的路由引入中呼叫了 views.py 檔案中的 HomepageView 類，所以還需要對該目錄下的 views.py 檔案進行修改，

from django.shortcuts import render
from django.views.generic import TemplateView

class HomepageView(TemplateView):
    template_name = "csdn/frontend/home.html"

上訴代碼的 HomepageView 類繼承自 TemplateView，它是一個通用視圖，作用就是渲染某個模板，繼承該類之后，只需要設定 template_name 模板名就可以渲染指定模板，當然也可以在宣傳的時候增加額外的引數，重新 get_context_data 方法即可，

class HomeView(TemplateView):
    template_name = "csdn/frontend/home.html"

    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        context["my_test"] = "橡皮擦測驗文字"
        return context

為了出現最終的效果，我調整了 header.html 檔案代碼，修改如下：

<nav class="navbar navbar-inverse">
    <div class="container">
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">首頁</a></li>
                <li><a href="#">關于我們</a></li>
                <li><a href="#">聯系我們</a></li>
            </ul>
        </div>
    </div>
</nav>

在 frontend_common.html 頁面增加了對變數的呼叫，修改代碼與最終呈現的效果如下，

div class="main-page">
    <div class="container">
        <div class="row">
            <div class="col-md-9 left-content">
                {% block left %} {% endblock %}
            </div>
            <div class="col-md-3 right-content">
                {{my_test}}
            </div>
        </div>
    </div>
</div>

自己動手寫個微型 CSDN 吧，還能實作網頁版 Blink，No.1

19.4 本篇博客小節

一個新鮮的專案，微型 CSDN 開工啦，一點點，我們在補充一點點知識，

本文章屬于《滾雪球學 Python 第三輪》中的一篇，歡迎繼續關注，

今天是持續寫作的第 143 / 200 天，可以點贊、評論、收藏啦，

繼續閱讀

游走在 “法律邊緣” 的資料采集者，直播梳理
CSDN 首發，收藏并實踐本文，你就是大學最靚的仔~
CSDN 的各位新博主們，交個朋友吧~

本文長尾關鍵詞，提供給機器使用，閱讀請忽略
Django 教程 python web 開發框架 django 官網 python 框架 django 入門
django rest framework 為什么 python 不適合開發網站
django 登錄注冊模塊實作 django 配合什么前端好 django 官網中文檔案

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/281661.html

標籤：其他

上一篇：聽說：用過這幾個網站的程式員，早已領先身邊人一大截！

下一篇：[Vue warn]: Invalid value for option "methods": expected an Object, but got Func