Django(二)精美博客搭建(9)实现文章详情页

前言

本章主要讲述 【文章详情页】 的实现

ps：关于详情界面，【上一篇/下一篇】模块，还有点问题，本篇先不实现，等我调通了会另外补一篇blog- -

---

环境：

• Pycharm
• python3.6
• mysql 5.7
• django 2.0.13

---

---

一、新功能项目概览

---

---

二、article模块具体实现

1、urls.py

# 文章详情
path('detail', article_detail, name='detail'),

---

2、views.py

• 该views中定义所有与文章相关的视图函数

from django.shortcuts import render

# Create your views here.
from article.models import Article
"""
    文章相关视图函数
"""


def article_detail(request):
    """
    查看文章详情
    :param request:
    :return:
    """
    id = request.GET.get('id')  # 拿到文章id
    # 根据id拿到文章
    article = Article.objects.get(pk=id)

    # 1、浏览量同步新增：点击一次，浏览量同步加1
    article.click_num += 1
    article.save()

    # 2、查询相关文章：即对应标签里的前6条数据
    tags_list = article.tags.all()  # 首先拿到标签列表
    # 定义【相关文章】list
    about_article_list = []
    for tag in tags_list:
        # 遍历拿到该文章对应标签里的文章列表
        for about_article in tag.article_set.all():
            # 文章不存在list里且少于6篇，则放到list中
            if about_article not in about_article_list and len(about_article_list) < 6:
                about_article_list.append(about_article)
    # print("about_article_list:", about_article_list)
    return render(request, 'article/info.html',
                  context={
   'article': article, 'about_article_list': about_article_list})

---

---

三、templates模块具体实现

1、新增info.html

• 之前说过了，不同的应用相关的页面，我们分别维护在不同的文件夹里面，让整个项目的层级结构更加清晰；所以我们在templates中新增article文件夹，然后在article下新建文章详情界面

{
   % extends 'base.html' %}
{
   % load staticfiles %}

{
   % block title %}
    博客详情
{
   % endblock %}

{
   # css样式部分 #}
{
   % block mycss %}
    {
   # 引进样式info.css ，m.css   #}
    <link href="{% static 'css/info.css' %}" rel="stylesheet">
    <link href="{% static 'css/m.css' %}" rel="stylesheet">
{
   % endblock %}

{
   # 内容部分 #}
{
   % block content %}
    <div class="infos">
        <div class="newsview">
            {
   #  内嵌title  #}
            <h2 class="intitle">您现在的位置是：<a href="{% url 'index' %}">网站首页</a> > <a
                    href="{% url 'article:detail' %}?id={
   { article.id }}">文章详情</a></h2>
            <h3 class="news_title">{