我的博客搭建之Django分页

  • 文章
  • 作者:Hubery
  • 发布时间:2019-04-23
  • 阅读数:2877
  • 分类:博客搭建
  • 标签: Django

关于分页:

    1、Django提供了分页工具Paination

    2、官网文档地址https://docs.djangoproject.com/en/2.1/topics/pagination/

    3、下面是一个在视图中使用的示例

# views.py
from django.core.paginator import Paginator  # 引入Paginator对象
from django.shortcuts import render
"""
Pagintor 接收两个参数 第一个可以是一个列表、元组、或QuerySet 第二个参数是准备
每页的数量
"""
def listing(request):
    contact_list = Contacts.obhects.all()  # 得到一个QuerySet
    paginator = Paginator(contact_list, 25) # 把这个对象穿进去,并每页展示25
    page = request.GET.get('page', 1)  # 得到访问的是第几页,默认值为1
    contacts = paginator.get_page(page)  # 获取对应页获取的内容
    return render(request, 'list.html', {'contacts': contacts})
# list.html
# 要展示的内容
{% for contact in contacts %}
    {# Each "contact" is a Contact model object. #}
     {# 每个contact 都是一个Contact 对象 可以直接获取这个模型对应字段的值  #}
    {{ contact.full_name|upper }}

    ...
{% endfor %}

{# 分页 #}
<div class="pagination">
    <span class="step-links">
        {% if contacts.has_previous %}
            {# 如果有上一页,点击进入上一页 #}
            <a href="?page=1">&laquo; first</a>
            <a href="?page={{ contacts.previous_page_number }}">previous</a>
        {% endif %}

        <span class="current">
            {# 显示当前在第几页 #}
            Page {{ contacts.number }} of {{ contacts.paginator.num_pages }}.
        </span>

        {% if contacts.has_next %}
         {# 如果有下一页,点击进入下一页 #}
            <a href="?page={{ contacts.next_page_number }}">next</a>
            <a href="?page={{ contacts.paginator.num_pages }}">last &raquo;</a>
        {% endif %}
    </span>
</div>

Django自带的分页工具已经能够满足基本的需求,但如果有很多页面都需要分页,将会有很多重复的工作,我们可以使用一个第三方应用dj-pagination,这个应用在pagination上进行的装,可以减少我们很多的工作量。我的博客就是基于这个第三方应用进行的分页。


参考文档:https://dj-pagination.readthedocs.io/en/latest/usage.html#custom-pagination-templates

  • 安装

pip install dj-pagination
  • 使用

    1、在INSTALLED_APPS添加应用

INSTALLED_APPS = (
    # ...
    'dj_pagination',
)

    2、安装分页中间件

MIDDLEWARE = (
    # ...
    'dj_pagination.middleware.PaginationMiddleware',
)

    3、在使用分页插件的html页面中加载分页标签

{% load pagination_tags %}

    4、确定分页的变量

#  object_list为后端传来的queryset数据比如下面的blogs
{% autopaginate object_list %}
# views.py
    deg get_blog(request):
        blogs = Blog.object.all()
        data = {
            'blogs':blogs
        }
        return render(request, 'index.html', context=data)

    5.加载默认样式的分页

{% paginate  %}

    6、有个完整的小示例(注意这样写会使用自带的简单的分页样式,样式比较丑)

{% load pagination_tags %}
{% autopaginate blogs %}
{% for blog in blogs %}
    {{blog.name}}
{% endfor %}
{% paginate %}

    7.加载并使用自定义样式

# 在templates文件夹下创建pagination文件
# 在pagination文件夹下创建my_pagination.html

# my_pagination.html
<style>
    ul.pagination {
    display: inline-block;
    padding: 0;
    margin: 0;
}

ul.pagination li {display: inline;}

ul.pagination li a {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
    border: 1px solid #ddd;
}

.pagination li:first-child a {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.pagination li:last-child a {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

ul.pagination li a.active {
    background-color: #4CAF50;
    color: white;
    border: 1px solid #4CAF50;
}
ul.pagination li a:hover:not(.active) {background-color: #ddd;}

.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
  color: #777;
  cursor: not-allowed;
  background-color: #fff;
  border-color: #ddd;
}

</style>
{% if is_paginated %}
{% load i18n %}
    <ul class="pagination">
    {% if page_obj.has_previous %}
        <li><a href="?page{{ page_suffix }}={{ page_obj.previous_page_number }}{{ getvars }}{{ hashtag }}">«</a></li>
        {% else %}
        <li  class="disabled" ><a href="javascript:volid(0);">«</a></li>
    {% endif %}
    {% for page in pages %}
        {% if page %}
            {% ifequal page page_obj.number %}
                 <li><a class="active" href="#">{{ page }}</a></li>
            {% else %}
                <li><a href="?page{{ page_suffix }}={{ page }}{{ getvars }}{{ hashtag }}" class="page">{{ page }}</a></li>
            {% endifequal %}
        {% else %}
            <li><a href="#">...</a></li>
        {% endif %}
    {% endfor %}
    {% if page_obj.has_next %}
        <li><a href="?page{{ page_suffix }}={{ page_obj.next_page_number }}{{ getvars }}{{ hashtag }}">&raquo;</a></li>
        {% else %}
        <li class="disabled"><a href="javascript:volid(0);" >&raquo;</a></li>
    {% endif %}
    </ul>
{% endif %}
# 使用
{% paginate using "pagination/my_pagination.html" %}

    8、在settings.py 设置通用配置

PAGINATION_DEFAULT_PAGINATION         每页显示数量  
PAGINATION_DEFAULT_WINDOW               分页显示在当前页左右两边的页数  
PAGINATION_DEFAULT_ORPHANS              最后一页显示的最小页数,默认为0  
PAGINATION_INVALID_PAGE_RAISES_404  当页数不存在时,是否显示404页面


效果图 颜色和样式可以在my_pagination.html 根据自己喜好修改

clipboard.png

评论列表
  Tia (2019-05-21 14:14): 回复
    不错 这是你自己总结的么
Hubery(2019-05-21 15:00) 回复 Tia: 回复
嗯嗯。
Tia(2019-05-21 17:15) 回复 Hubery: 回复
可以的,加油!!

新的评论