作者:HelloGitHub-追梦人物

文中涉及的示例代码,已同步更新到 HelloGitHub-Team 仓库

侧边栏已经正确地显示了最新文章列表、归档、分类、标签等信息。现在来完善归档、分类和标签功能,当用户点击归档下的某个日期、分类栏目下的某个分类或者标签栏目下的某个标签时,跳转到文章列表页面,显示该日期、分类或者标签下的全部文章。

归档页面

要显示某个归档日期下的文章列表,思路和显示主页文章列表是一样的,回顾一下主页视图的代码:

blog/views.py

def index(request):
post_list = Post.objects.all().order_by('-created_time')
return render(request, 'blog/index.html', context={'post_list': post_list})

主页视图函数中通过 Post.objects.all() 获取全部文章,而在归档和分类视图中,我们不再使用 all 方法获取全部文章,而是使用 filter 来根据条件过滤。先来看归档视图:

blog/views.py

def archive(request, year, month):
post_list = Post.objects.filter(created_time__year=year,
created_time__month=month
).order_by('-created_time')
return render(request, 'blog/index.html', context={'post_list': post_list})

这里使用了模型管理器(objects)的 filter 方法来过滤文章。由于是按照日期归档,因此这里根据文章发表的年和月来过滤。具体来说,就是根据 created_timeyearmonth 属性过滤,筛选出文章发表在对应的 year 年和 month 月的文章。注意这里 created_time 是 Python 的 date 对象,其有一个 yearmonth 属性,我们在 页面侧边栏:使用自定义模板标签 使用过这个属性。Python 中调用属性的方式通常是 created_time.year,但是由于这里作为方法的参数列表,所以 django 要求我们把点替换成了两个下划线,即 created_time__year。同时和 index 视图中一样,我们对返回的文章列表进行了排序。此外由于归档页面和首页展示文章的形式是一样的,因此直接复用了 index.html 模板。

写好视图函数后就是配置好 URL:

blog/urls.py

from django.urls import path

from . import views

app_name = 'blog'
urlpatterns = [
path('', views.index, name='index'),
path('posts/<int:pk>/', views.detail, name='detail'),
path('archives/<int:year>/<int:month>/', views.archive, name='archive'),
]

这个归档视图对应的 URL 和 detail 视图函数对应的 URL 是类似的,这在之前我们讲过,django 会从用户访问的 URL 中自动提取 URL 路径参数转换器 <type:name> 规则捕获的值,然后传递给其对应的视图函数。例如如果用户想查看 2017 年 3 月下的全部文章,他访问 /archives/2017/3/,那么 URL 转换器就会根据规则捕获到 2017 和 3 这两个整数,然后作为参数传给 archive 视图函数, archive 视图函数的实际调用为:archive(request, year=2017, month=3)

接下来在 inclusions 文件夹下找到 archives 的模板,修改超链接的 href 属性,让用户点击超链接后跳转到文章归档页面:

inclusions/_archives.html

...
{% for date in date_list %}
<li>
<a href="{% url 'blog:archive' date.year date.month %}">
{{ date.year }} 年 {{ date.month }} 月
</a>
</li>
{% endfor %}
...

这里 {% url %} 这个模板标签的作用是解析视图函数 blog:archive 对应的 URL 模式,并把 URL 模式中的年和月替换成 date.yeardate.month 的值。

{% url %} 模板标签接收的第一个参数为被解析视图函数的端点值,这个端点值由 2 部分组成,中间由冒号分隔。第一部分为在应用的 urls.py 中指定的 app_name 的值(充当命名空间,这样即使不同 app 下有相同的视图函数名,也不会冲突),第二部分 path 函数中传入的 name 参数的值。比如在 blog 应用的 urls.py 模块,我们指定了 app_name = 'blog'archive 视图函数的 url 模式为 path('archives/<int:year>/<int:month>/', views.archive, name='archive'),因此对应的端点值为 blog:archive

{% url %} 模板标签接收的其它参数为 URL 路径参数,即 URL 模式中路径参数转换器需要捕获的值。例如 archive 视图函数对应的 URL 模式为 archives/<int:year>/<int:month>/,假设 date.year=2017date.month=5,那么 {% url 'blog:archive' date.year date.month %} 模板标签返回的值为 /archives/2017/5/。

为什么要使用 {% url %} 模板标签呢?事实上,我们把超链接的 href 属性设置为 /archives/{{ date.year }}/{{ date.month }}/ 同样可以达到目的,但是这种写法是硬编码的。虽然现在 blog:archive 视图函数对应的 URL 模式是这种形式,但是如果哪天这个模式改变了呢?如果使用了硬编码的写法,那你需要把每一处 /archives/{{ date.year }}/{{ date.month }}/ 修改为新的模式。但如果使用了 {% url %} 模板标签,则不用做任何修改。

测试一下,点击侧边栏归档的日期,跳转到归档页面,发现显示的就是归档下的文章列表。

分类页面

同样的写好分类页面的视图函数:

blog/views.py

import markdown

from django.shortcuts import render, get_object_or_404

# 引入 Category 类
from .models import Post, Category def category(request, pk):
# 记得在开始部分导入 Category 类
cate = get_object_or_404(Category, pk=pk)
post_list = Post.objects.filter(category=cate).order_by('-created_time')
return render(request, 'blog/index.html', context={'post_list': post_list})

这里我们首先根据传入的 pk 值(也就是被访问的分类的 id 值)从数据库中获取到这个分类。get_object_or_404 函数和 detail 视图中一样,其作用是如果用户访问的分类不存在,则返回一个 404 错误页面以提示用户访问的资源不存在。然后我们通过模型管理器的 filter 方法过滤出了该分类下的全部文章。同样也和首页视图中一样对返回的文章列表进行了排序。

URL 配置如下:

blog/urls.py

urlpatterns = [
path('archives/<int:year>/<int:month>/', views.archive, name='archive'),
path('categories/<int:pk>/', views.category, name='category'),
]

这个分类页面对应的 URL 模式和文章详情页面对应的 URL 模式十分类似,你可以自己分析分析它是如何工作的,在此就不赘述了。

修改相应模板:

inclusions/_categories.html

...
{% for category in category_list %}
<li>
<a href="{% url 'blog:category' category.pk %}">{{ category.name }}</a>
</li>
{% endfor %}
...

同样,{% url %} 模板标签的用法和写归档页面时的用法是一样的。现在尝试点击相应的链接,就可以跳转到归档或者分类页面了。

标签页面

标签页和分类是完全一样的步骤,因此稍微修改一下分类相关的代码就可以用于标签了。

blog/views.py

from .models import Category, Post, Tag

def tag(request, pk):
# 记得在开始部分导入 Tag 类
t = get_object_or_404(Tag, pk=pk)
post_list = Post.objects.filter(tags=t).order_by('-created_time')
return render(request, 'blog/index.html', context={'post_list': post_list})

可以看到和 category 几乎一样,只是这里根据 tag 来筛选文章。

然后是配置 url:

from django.urls import path

from . import views

app_name = 'blog'
urlpatterns = [
...
path('categories/<int:pk>/', views.category, name='category'),
path('tags/<int:pk>/', views.tag, name='tag'),
]

再修改一下 inclusions\_tags.html 模板中的跳转链接:

...
{% for tag in tag_list %}
<li>
<a href="{% url 'blog:tag' tag.pk %}">{{ tag.name }}</a>
</li>
{% empty %}
暂无标签!
{% endfor %}
...

侧边栏的功能这里差不多就都做完了。

欢迎关注 HelloGitHub 公众号,获取更多开源项目的资料和内容

HelloDjango 第 13 篇:分类、归档和标签页的更多相关文章

  1. WordPress获取某个分类关联的标签

    我在WordPress后台某篇文章的编辑页面,给这篇文章选择了分类:WordPress,接着同时选择了标签:php.主题制作,这时分类(WordPress)就与标签(php.主题制作)建立了关联,利用 ...

  2. 在Bootstrap开发中解决Tab标签页切换图表显示问题

    在做响应式页面的时候,往往需要考虑更多尺寸设备的界面兼容性,一般不能写死像素,以便能够使得界面元素能够根据设备的不同进行动态调整,但往往有时候还是碰到一些问题,如Tab标签第一页面正常显示,但是切换其 ...

  3. easyui学习笔记12—tab标签页的添加和删除

    这一篇我们来看看标签页的添加和删除动作.我在想看这些例子还不如看文档,文档的内容更加全面,但是文档全部是理论没有实际的操作,看起来很枯燥,文档只能是遇到问题的时候查.easyui的文档写的还是很详细的 ...

  4. Mahout贝叶斯算法拓展篇3---分类无标签数据

    代码測试环境:Hadoop2.4+Mahout1.0 前面博客:mahout贝叶斯算法开发思路(拓展篇)1和mahout贝叶斯算法开发思路(拓展篇)2 分析了Mahout中贝叶斯算法针对数值型数据的处 ...

  5. 如何用softmax和sigmoid来做多分类和多标签分类

    首先,说下多类分类和多标签分类的区别 多标签分类:一个样本可以属于多个类别(或标签),不同类之间是有关联的,比如一个文本被被划分成“人物”和“体育人物”两个标签.很显然这两个标签不是互斥的,而是有关联 ...

  6. Mysql高手系列 - 第13篇:细说NULL导致的神坑,让人防不胜防

    这是Mysql系列第13篇. 环境:mysql5.7.25,cmd命令中进行演示. 当数据的值为NULL的时候,可能出现各种意想不到的效果,让人防不胜防,我们来看看NULL导致的各种神坑,如何避免? ...

  7. html的标签分类————body内标签系列

    超链接标签 <a href="" target="_blank">text</a>,此类标签通常是超链接.其中href后面跟进的是超链接 ...

  8. Bootstrap学习js插件篇之标签页

    简单的标签页 代码: <h1 class="page-header">4.3标签页</h1> <ul class="nav nav-tabs ...

  9. Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”

    Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...

随机推荐

  1. JSP使用分层实现业务处理

    在Java开发中,使用JDBC操作数据库的四个步骤如下:   ①加载数据库驱动程序(Class.forName("数据库驱动类");)   ②连接数据库(Connection co ...

  2. 第二章 javaScript操作BOM

    什么是BOM      BOM(Browser Object Model)即浏览器对象模型.      BOM提供了独立于内容 而与浏览器窗口进行交互的对象:      由于BOM主要用于管理窗口与窗 ...

  3. 【iOS】更新 CocoaPods 后 Podfile 报错

    更新了 CocoaPods 后,再执行 "pod install" 时报了如下错误: [!] The dependency `AFOnoResponseSerializer` is ...

  4. ubuntu 13.10 eclipse 菜单栏不可用的问题

    最近手贱,从官网上下载了最新的版eclipse,把一原来的3.8版本替换了,然后就发现eclipse菜单栏废了,吓我一跳,以为Ubuntu又初问题,又重新弄了一次eclipse(我直接用的压缩包),上 ...

  5. Codeforces Round #219(Div. 2)373 B. Making Sequences is Fun(二分+找规律)

    题目意思大概是给你w,m,k三个数,让你从m开始找 m m+1 m+2 m+3...........m+m', 使得他们的权值之和不超过w,计算权值的方法如下S(n)·k . S(n)表示n有多少位数 ...

  6. 基于JaCoCo的Android测试覆盖率统计(二)

    > 本文章是我上一篇文章的升级版本,详见地址:https://www.cnblogs.com/xiaoluosun/p/7234606.html ## 为什么要做这个?1. 辛辛苦苦写了几百条测 ...

  7. 浅入深出Vue:自动化路由

    在软件开发的过程中,"自动化"这个词出现的频率是比较高的.自动化测试,自动化数据映射以及各式的代码生成器.这些词语的背后,也说明了在软件开发的过程中,对于那些重复.千篇一律的事情. ...

  8. java常见面试题目(三)

    1.jsp的内置对象. JSP中一共预先定义了9个这样的对象,分别为:request.response.session.application.out.pagecontext.config.page. ...

  9. 【Java例题】3.2字符图形

    2.输出以下字符图形. 比如,当n=6时,结果如下: 1 2 2 2 3 3 3 3 3 4 4 4 4 4 4 5 5 5 5 6 6 再比如,当n=7时,结果如下: 1 2 2 2 3 3 3 3 ...

  10. java支付宝app支付-代码实现

    1.我们需要在支付宝商户平台配置好,取到四个参数如下(这是支付宝官方配置地址):https://www.cnblogs.com/fuzongle/p/10217144.html 合作身份者ID:123 ...