美文网首页
Django 个人博客 - 详情页面 - step7

Django 个人博客 - 详情页面 - step7

作者: Spareribs | 来源:发表于2017-01-06 17:41 被阅读436次

知识点

各个小模块点击以后有可能会发生跳转到对应的页面,这里主要有3个小模块,标签云、文章归档和文章的详情页面需要添加。主要思路是,点击后发生请求,后端获取到前端的请求再做出响应。

1 标签云详情页

前端请求的href【tags.html】

<li><a href='{% url "biaoqian" %}?tag={{ tag }}'>{{ tag }}</a></li>

请求到了路由【urls.py】

from django.conf.urls import url
from blog.views import biaoqian

urlpatterns = [
    url(r'^biaoqian$', biaoqian, name='biaoqian'),
]

路由将请求转给视图【views.py】

def biaoqian(request):
    try:
        # 获取请求的tag参数
        tag_name = request.GET.get('tag', None)
        # 找到tag所对应的Tag对象
        tag_obj = Tag.objects.get(name=tag_name)
        # 使用_set通过一对多关系进行查找
        article_list = tag_obj.article_set.all()
    except Exception as e:
        logging.error(e)
    return render(request, 'biaoqian.html', locals())

视图将数据传递给前段模板渲染【biaoqian.html】

{% extends 'base.html' %}
{% load staticfiles %}
{% block left_content %}
{% include 'baseblock/ads.html' %}
<!-- banner代码 结束 -->
<div class="topnews">
    <h2>{{ request.GET.tag }} 标签云</h2>
    {% for article in article_list%}
    <div class="blogs">
        <ul>
            <h3><a href="/">{{ article.title }}</a></h3>
            <p>{{ article.desc }}</p>
            <p class="autor">
                <span class="lm f_l">
                    {% for tag in article.tag.all %}
                    <a href="/">{{ tag.name }}</a> 
                    {% endfor %}
                </span>
                <span class="dtime f_l">{{ article.date_publish | date:'Y-m-d' }}</span>
                <span class="viewnum f_r">浏览(<a href="/">{{ article.click_count }}</a>)</span>
                <span class="pingl f_r">评论(<a href="/">{{ article.comment_set.all.count }}</a>)</span>
            </p>
        </ul>
    </div>
    {% endfor %}
</div>
{% endblock %}

2 文章归档详情页(方法与标签云类似)

前端请求的href【sorts.html】
silce切片类似于[:4],获取需要的数据

<li><p><span class="tutime font-size-18"><a href='{% url "archive" %}?year={{ article_date | slice:":4" }}&month={{ article_date | slice:"7:9" }}'>{{ article_date }}</a></span></p></li>

请求转到路由【urls.py】

from django.conf.urls import url
from blog.views import archive

urlpatterns = [
    url(r'^archive$', archive, name='archive'),
]

路由将请求转给视图【views.py】

def archive(request):
    try:
        # 先获取用户提交的year和month信息
        year = request.GET.get('year', None)
        month = request.GET.get('month', None)
        # 通过filter过滤出对应年份的数据(icontains是包含)
        article_list = Article.objects.filter(date_publish__icontains=year + '-' + month)
    except Exception as e:
        logging.error(e)
    return render(request, 'archive.html', locals())

视图将数据传递给前段模板渲染【atchive.html】

{% extends 'base.html' %}
{% load staticfiles %}
{% block left_content %}
{% include 'baseblock/ads.html' %}
<!-- banner代码 结束 -->
<div class="topnews">
    <h2>{{ request.GET.year }}年{{ request.GET.month }}月 归档文章</h2>
    {% for article in article_list%}
    <div class="blogs">
        <ul>
            <h3><a href="/">{{ article.title }}</a></h3>
            <p>{{ article.desc }}</p>
            <p class="autor">
                <span class="lm f_l">
                    {% for tag in article.tag.all %}
                    <a href="/">{{ tag.name }}</a> 
                    {% endfor %}
                </span>
                <span class="dtime f_l">{{ article.date_publish | date:'Y-m-d' }}</span>
                <span class="viewnum f_r">浏览(<a href="/">{{ article.click_count }}</a>)</span>
                <span class="pingl f_r">评论(<a href="/">{{ article.comment_set.all.count }}</a>)</span>
            </p>
        </ul>
    </div>
    {% endfor %}
</div>
{% endblock %}

3 文章详情页面设计

前端请求的href【sorts.html】
总共有3个地方:博客首页、文章排行、归档详情页面

## index.html【博客首页】
<h3><a href='{% url "article" %}?id={{ article.id }}'>{{ article.title }}</a></h3>

## chart.html【文章排行】
<li><a href='{% url "article" %}?id={{ article_click.id }}' target="_blank">{{ article_click }}</a></li>
<li><a href='{% url "article" %}?id={{ article_comment.id }}' target="_blank">{{ article_comment }}</a></li>
<li><a href='{% url "article" %}?id={{ article_recommend.id }}' target="_blank">{{ article_recommend }}</a></li>

## archive.html【归档详情页面】
<h3><a href='{% url "article" %}?id={{ article.id }}'>{{ article.title }}</a></h3>

请求转到路由【urls.py】

from django.conf.urls import url
from blog.views import article

urlpatterns = [
    url(r'^article/$', article, name='article'),
]

路由将请求转给视图【views.py】

# 文章详情
def article(request):
    try:
        # 获取文章id
        id = request.GET.get('id', None)
        try:
            # 获取文章信息
            article = Article.objects.get(pk=id)
        except Article.DoesNotExist:
            return render(request, 'failure.html', {'reason': '没有找到对应的文章'})
    except Exception as e:
        print e
        logging.error(e)
    return render(request, 'article.html', locals())

app下面新建一个templatetags目录自定义过滤器【myfilter.py】

# -*- coding: utf-8 -*-
from django import template
register = template.Library()

# 定义一个将日期中的月份转换为大写的过滤器,如8转换为八
@register.filter
def month_to_upper(key):
        return ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'][key.month-1]

视图将数据传递给前段模板渲染【article.html】
这里使用了自定义的过滤器获取对应月份的大写

{% extends 'base.html' %}
{% load staticfiles %}
{% load myfilter %}
{% block left_content %}
<div class="postdate">
    <div class="month">{{ article.date_publish | month_to_upper }}</div>
    <div class="date">{{ article.date_publish | date:'d' }}</div>
</div>
<div class="title">
    <h2><a href="" rel="bookmark" title="{{ article.title }}">{{ article.title }}</a></h2>
    <div class="postmeta">
        <span class="postmeta_author">{{ article.user.username }}</span>
        <span class="postmeta_category"><a href="" rel="category">{{ article.category.name }}</a></span>
        <span class="postmeta_time">{{ article.date_publish | date:'Y-m-d' }}</span>
    </div>
</div>
<div class="entry">
    {{ article.content | safe }}
</div>
<span class="tags">
    {% for tag in article.tag.all %}
    <a href="?tag={{ tag.name }}" rel="tag">{{ tag.name }}</a>
    {% endfor %}
</span>
{% endblock %}

相关下载

详情页面_代码


欢迎留言,博文会持续更新~~

相关文章

  • Django 个人博客 - 详情页面 - step7

    知识点 各个小模块点击以后有可能会发生跳转到对应的页面,这里主要有3个小模块,标签云、文章归档和文章的详情页面需要...

  • Django搭建个人博客:编写文章详情页面

    有了文章列表页面后,当然还需要详情页面,方便用户对某一篇感兴趣的文章深入阅读。 编写视图函数 打开article/...

  • 搭建博客笔记:py_kouga (四) 详情页面

    参考教程 Django博客教程 自强学堂 目前打开详情页面,会报错。所以就来解决一下这个问题。 url 用正则表达...

  • Django搭建博客页面

    Django基本使用以及博客搭建的准备工作,请参考Django入门与实践 博客主页面编写 编写思路 取出数据库中所...

  • 个人博客搭建完成

    花了一个周末,用Django搭建了个人博客。其中参照了Django 博客开发教程。 个人博客只是初步完成,需要修改...

  • Django 个人博客

    说明 本文是使用Django框架实现的一个简单的个人博客 前端 详细开发流程 step1:基本环境搭建step2:...

  • Django 个人博客 - 文章分页 - step8

    知识点 博客的文章随着时间会增加,现有博客首页、标签详情页、归档详情页面都会显示所有文章。虽然像文章归档,排行榜等...

  • 利用Django+bootstrap实现个人博客

    Django+bootstrap实现个人博客 版本: python 3.6.2django 1.11.6boots...

  • Django发布应用application

    欢迎访问个人博客 Django deploy application 当Django的application开发完...

  • Vue3+TypeScript+Django Rest Fram

    博客网站最重要的是有一个给用户浏览文章的页面,也就是博客网站的前台,用户通过这个页面可以查找文章,浏览文章详情,评...

网友评论

      本文标题:Django 个人博客 - 详情页面 - step7

      本文链接:https://www.haomeiwen.com/subject/uwzgvttx.html