网站搭建 (第03天) 分页功能

一、前言

真的是挺久没有更新网站搭建了，因为最近在学习网络爬虫，又忙着考驾照，每一天都要练车，所以能利用的时间就只有晚上了。话不多说，直接开始了解Django的分页器吧，其实分页器的功能挺强大的，可以通过导入Paginator对象来实现文章的分页，列表的分页，还有上一页和下一页的功能。最好是参考Django的官方文档：分页|Django文档，也可以参考之前写的Django入门: (第十天) 分页器的使用，下面简单的写个例子吧。

>>> from django.core.paginator import Paginator # 导入Paginator模块
>>> list1=[i for i in range(0,150)] # 使用列表生成器生成一个包含150个数字的列表
>>> page1=Paginator(list1,10) # 生成一个Paginator对象
>>> print(page1.count) # 打印总的记录数,即列表list1的长度
150
>>> print(page1.num_pages) # 打印总的页数,即总记录数除以每页显示的条目数
15
>>> print(page1.page_range) # 页数的列表
range(1, 16)
>>> print(page1.page(1)) # 打印第一页的page对象
<Page 1 of 15>
>>> page1.page(1).object_list # 打印第一页的所有记录
[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
>>> page1.page(2).object_list # 打印第二页的所有记录
[10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
>>> page1.page(2).next_page_number() # 打印当前的页(第2页)的下一页的页码
3
>>> page1.page(2).has_next() # 第2页是否有下一页
True
>>> page1.page(2).has_previous() # 第2页是否有上一页
True
>>> page1.page(2).has_other_pages() # 第2是否有其他页
True
>>> page1.page(2).start_index() # 第2页第一条记录的序号
11
>>> page1.page(2).end_index() # 第2页最后一条记录的序号
20
>>> page1.page(0) # 第0页是否有记录,会报错
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
    ...
    raise EmptyPage(_('That page number is less than 1'))
django.core.paginator.EmptyPage: <exception str() failed>
>>> page1.page(15) # 打印第15页的对象
<Page 15 of 15>

二、代码展示

　　后端分页功能代码

from django.core.paginator import Paginator #导入Paginator模块

# 创建一个分页器对象,参数分别是文章列表,每页最大文章数量
# 这里的EACH_RAGE_BLOG_NUMBER等于10,已经当成常量写进了seetings里
paginator = Paginator(post_all_list, settings.EACH_RAGE_BLOG_NUMBER)

# 采用get方式获取用户访问的页码,如果获取不到,默认为第一页
page_num = request.GET.get('page', 1)

# 因为用户输入不一定是数字,所以需要用int(page_num),而django里的get_page会自动识别用户输入以及页码范围
# 注意这里的page_of_list是一个paginator对象
page_of_list = paginator.page(int(page_num))

# 获取当前页码
current_page_num = page_of_list.number

# 获取当前页码前后各两页的页码范围
# 需要注意判断的是:如果当前页是第一页,那么前两页不能是0,也不能是-1,所以要使用内置max函数来与1比较最大值
# 同理:如果当前页已经是最后一页,那么就不能取到当前页+2的页码了,所以要使用内置min函数来与最大页码比较最小值
page_range = list(range(max(current_page_num - 2, 1), current_page_num)) + \
    list(range(current_page_num, min(current_page_num + 2, paginator.num_pages) + 1))

# 加上省略页码标记
# paginator.num_pages表示一共有多少页码
if page_range[0] - 1 >= 2:
    page_range.insert(0, '...')
if paginator.num_pages - page_range[-1] >= 2:
    page_range.append('...')

# 加上首页尾页
# paginator.num_pages表示一共有多少页码
if page_range[0] != 1:
    page_range.insert(0, 1)
if page_range[-1] != paginator.num_pages:
    page_range.append(paginator.num_pages)

　　前端代码

<div class="paginator">
    <ul class="pagination">
        <li>
            {# 上一页 #}
            {% if page_of_list.has_previous %}
                <a href="?page={{ page_of_list.previous_page_number }}" aria-label="Previous">
                    <span aria-hidden="true">上一页</span>
                </a>
            {% else %}
                <span aria-hidden="true">«</span>
            {% endif %}
        </li>
        {# 全部页码 #}
        {# {% for page_num in page_of_list.paginator.page_range %}#}
        {# page_range在views中被处理成当前页数+-2的范围,目的是为了避免页码过于长#}
        {% for page_num in page_range %}
            {# 判断是否当前页 #}
            {% if page_num == page_of_list.number %}
                {# 如果是当前页就设置active高亮 #}
                <li class="active"><a href="?page={{ page_num }}">{{ page_num }}</a></li>
            {% else %}
                {% if page_num == '...' %}
                    <li><span>{{ page_num }}</span></li>
                {% else %}
                    <li><a href="?page={{ page_num }}">{{ page_num }}</a></li>
                {% endif %}
            {% endif %}
        {% endfor %}
                <li>
        {# 下一页 #}
        {% if page_of_list.has_next %}
            <a href="?page={{ page_of_list.next_page_number }}" aria-label="Previous">
                <span aria-hidden="true">下一页</span>
            </a>
        {% else %}
            <span aria-hidden="true">»</span>
                </li>
        {% endif %}
    </ul>
    <p>
        共有{{ page_of_list.paginator.count }}篇博客,
        当前第{{ page_of_list.number }}页, 共{{ page_of_list.paginator.num_pages }}页
    </p>
</div>

原文出处：https://jzfblog.com/detail/42，文章的更新编辑以此链接为准。欢迎关注源站文章！

网站搭建 (第03天) 分页功能

一、前言

二、代码展示

猜你喜欢