django 使用dj-pagination 来实现分页

1.安装dj-pagination

pip install dj-pagination

2.配置setting文件

• 打开django项目的配置文件。在INSTALLED_APPS加入此应用。

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

• MIDDLEWARE 安装分页中间件。您的设置文件如下所示：

MIDDLEWARE = [
    ...
    'dj_pagination.middleware.PaginationMiddleware',
]

• 在TEMPLATES中添加请求上下文处理器。

[
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')]
        ,
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                ...
                'django.template.context_processors.request',
                'django.template.context_processors.debug',
                'django.template.context_processors.i18n',
                'django.template.context_processors.media',
                'django.contrib.auth.context_processors.auth',

            ],
        },
    },
]

3.配置模板

在你需要添加分页的模板文件的顶部加载标签pagination_tags

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

找到你想要进行分页的模型列表，并在迭代之前在该变量上使用autopaginate标签。（使用规范post_list作为示例变量）：

...
{% autopaginate post_list %} 
{# 在迭代post前加入{% autopaginate object_list %} #}
{# 可以控制每页的数量，在object_list后面填写要每页文章的数量  默认20 #}
{# 如 ：{% autopaginate post_list 10  %}  #}
{% for post in post_list %}
...
{% endfor %}
...

完成后在您想要显示分页的位置，加入paginate标签：

{ ％ paginate  ％}

运行你的项目。打开页面可以看到分页。

4.自定义分页模板

dj-pagination的默认模板很简陋我们希望用bootstrap4的分页样式来美化一下。需要引入bootstrap4的样式文件。我们使用cdn,复制下面代码粘贴到你的head中。

<link href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> 
<script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>

找到dj-pagination的模板文件。在你的python包目录下的dj_pagination\templates\pagination\pagination.html
备份默认模板。
打开pagination.html，修改为如下代码：

{% if is_paginated %}
{% load i18n %}
<nav aria-label="Page navigation example">
<ul class="pagination">
  {% block previouslink %}
  {% if page_obj.has_previous %}
  {% if disable_link_for_first_page and page_obj.previous_page_number == 1 %}
  <li class="page-item"><a href="{{ request.path }}{% if getvars %}?{{ getvars|slice:"1:" }}{% endif %}" class="prev page-link">{{ previous_link_decorator|safe }}{% trans "" %}</a></li>
  {% else %}
  <li class="page-item"><a href="?page{{ page_suffix }}={{ page_obj.previous_page_number }}{{ getvars }}" class="prev page-link">{{ previous_link_decorator|safe }}{% trans "" %}</a></li>
  {% endif %}
  {% else %}
  {% if display_disabled_previous_link %}
  <li class="page-item"><span class="disabled prev page-link">{{ previous_link_decorator|safe }}{% trans "previous" %}</span></li>
  {% endif %}
  {% endif %}
  {% endblock previouslink %}
  {% block pagelinks %}
  {% if display_page_links %}
  {% for page in pages %}
  {% if page %}
  {% ifequal page page_obj.number %}
  <li class="page-item active"><a class="current page page-link ">{{ page }}<span class="sr-only">(current)</span></a></li>
  {% else %}
  {% if disable_link_for_first_page and page == 1 %}
  <li class="page-item"><a href="{{ request.path }}{% if getvars %}?{{ getvars|slice:"1:" }}{% endif %}" class="page page-link">{{ page }}</a></li>
  {% else %}
  <li class="page-item"><a href="?page{{ page_suffix }}={{ page }}{{ getvars }}" class="page page-link">{{ page }}</a></li>
  {% endif %}
  {% endifequal %}
  {% else %}
  <li class="page-item">...</li>
  {% endif %}
  {% endfor %}
  {% endif %}
  {% endblock pagelinks %}
  {% block nextlink %}
  {% if page_obj.has_next %}
  <li class="page-item"><a href="?page{{ page_suffix }}={{ page_obj.next_page_number }}{{ getvars }}" class="next page-link">{% trans "" %}{{ next_link_decorator|safe }}</a></li>
  {% else %}
  {% if display_disabled_next_link %}
  <li class="page-item"><span class="disabled next page-link">{% trans "" %}{{ next_link_decorator|safe }}</span></li>
  {% endif %}
  {% endif %}
  {% endblock nextlink %}
</ul>
</nav>
{% endif %}

完毕！再次刷新网页，分页就美观了。

完美分页图