Pagination分页

ⅰ亾dé卋堺 提交于 2021-01-14 10:14:40

基本语法

下面展示Paginator的基本使用

>>> from django.core.paginator import Paginator
>>> objects = ['john', 'paul', 'george', 'ringo']
>>> p = Paginator(objects, 2)

>>> p.count
4
>>> p.num_pages
2
>>> type(p.page_range)
<class 'range_iterator'>
>>> p.page_range
range(1, 3)

>>> page1 = p.page(1)
>>> page1
<Page 1 of 2>
>>> page1.object_list
['john', 'paul']

>>> page2 = p.page(2)
>>> page2.object_list
['george', 'ringo']
>>> page2.has_next()
False
>>> page2.has_previous()
True
>>> page2.has_other_pages()
True
>>> page2.next_page_number()
Traceback (most recent call last):
...
EmptyPage: That page contains no results
>>> page2.previous_page_number()
1
>>> page2.start_index() # The 1-based index of the first item on this page
3
>>> page2.end_index() # The 1-based index of the last item on this page
4

>>> p.page(0)
Traceback (most recent call last):
...
EmptyPage: That page number is less than 1
>>> p.page(3)
Traceback (most recent call last):
...
EmptyPage: That page contains no results

实际应用

编写视图

class TaskListPageView(View):

    def get(self, request, page=None):
        if page:
            page_num = int(page)
        else:
            page_num = 1
        # 每页10条数据
        p = Paginator(tasks_all, 10)	# 假设tasks_all是所有的待分页的数据集
        # page_num页码的数据
        tasks = p.page(page_num)
        # 总页数
        page_count = p.num_pages

        # 获取分页器的页码列表,得到当前页最近的7个页码
        page_num_list = get_page_num_list(page_count, page_num, 7)

        context = {
            "tasks": tasks,
            "last_page": page_count,
            "page_num_list": page_num_list,
        }
        return render(request=request, template_name="task/list.html", context=context)

在分页时,我们需要获取到当前的页码来展示对应页码的数据,上面页码传递采用的方式是url传递,在此处用get方法的page参数接收。

当然再传递页码时也可以采用常用的get参数传递,即放在路径的”?“后面,这样传递的话就要使用request.GET.get['page']来获取。

编写路径

path('list/<int:page>', task.TaskListPageView.as_view(), name='list'),

如上面所说的,我们在这里将页码参数page放在url中传递给视图。

编写页面

<div class="page">
    {% if tasks.has_previous %}
        <a href="javascript:page_href(1)">首页</a>
        <a href="javascript:page_href({{ tasks.previous_page_number }})">上一页</a>
    {% else %}
         <a class="page-disabled">首页</a>
         <a class="page-disabled">上一页</a>
    {% endif %}

    {% for page in page_num_list %}
        {% ifequal page tasks.number %}
            <a class="page-tag active" href="javascript:page_href({{ page }})">
                {{ page }}
            </a>
        {% else %}
            <a class="page-tag" href="javascript:page_href({{ page }})">
                {{ page }}
            </a>
        {% endifequal %}
    {% endfor %}

    {% if tasks.has_next %}
            <a href="javascript:page_href({{ tasks.next_page_number }})">下一页</a>
            <a href="javascript:page_href({{ last_page }})">尾页</a>
    {% else %}
         <a class="page-disabled">下一页</a>
         <a class="page-disabled">尾页</a>
    {% endif %}
</div>

在上面展示了页面上的分页栏,这里不对其中的css样式作说明,只关注分页功能。

上面的分页跳转都是通过点击触发一个函数,从而链接到相应的页面。

function page_href(page) {
    # 获取当前页面"?"后面的参数
    var search = window.location.search;
    # 将参数和页码拼接出新的地址
    location.href = '/task/list/' + page + search;
}

注意,在我们对搜索结果进行分页时一定要把参数加入到新的中后面,即上面search的内容,否则跳转的是所有结果的页面,而不是搜索结果的页面。

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!