Django框架之分页器使用
1.Django框架之web框架优化2.Django框架之python后端框架介绍3.Django框架之Django的安装与使用4.Django框架之小白必会三板斧5.Django框架之静态文件6.Django框架之request对象7.Django框架之ORM操作8.Django框架之请求生命周期流程图9.Django框架之路由层10.Django框架之视图层11.Django框架之模板层12.Django框架之模型层13.Django框架之Ajax基础14.Django框架之Ajax进阶15.JS插件补充16.Django框架之序列化组件17.Django框架之批量插入数据
18.Django框架之分页器使用
19.Django框架之form组件20.Django框架之Cookie和Session21.Django框架之中间件22.Django框架之auth模块23.Django便捷函数shortcuts一、问题描述
针对上一篇章的批量插入数据，我们会发现一个很严重的问题，将所有数据都放到前端页面展示的时候一千多条数据放在了一页，这样太不方便，就像书本一样，不可能把所有内容都放在一页吧。
所以我们可以也想书本一样，尝试做分页处理
二、分页推导
首先需要明确的是，get请求/post请求都可以携带参数，所以在朝后端发送数据时，可以携带一个参数告诉后端我们想看第几页的数据。
还有一点就是，Queryset对象支持索引和切片操作，但是不支持负数索引情况。
1、第一页分析
book_list = models.Book.objects.all() # 获取用户想访问的页码 如果没有 默认展示第一页 current_page = request.GET.get("page",1) # 由于后端接受到的前端数据是字符串类型所以我们这里做类型转换处理加异常捕获 try: current_page = int(current_page) except Exception as e: current_page = 1 # 还需要定义页面到底展示几条数据 per_page_num = 10 # 一页展示10条数据 # 需要对总数据进行切片操作 需要确定切片起始位置和终止位置 start_page = ? end_page = ?
然后需要研究起止页的位置，也就是current_page、per_page_num、start_page、end_page四个参数之间的数据关系
2、整体分析
current_page、per_page_num、start_page、end_page四个参数之间的数据关系
per_page_num = 10 current_page start_page end_page 1 0 10 2 10 20 3 20 30 4 30 40 per_page_num = 5 current_page start_page end_page 1 0 5 2 5 10 3 10 15 4 15 20 start_page = (current_page - 1) * per_page_num end_page = current_page* per_page_num
- 可以很明显的看出规律
start_page = (current_page - 1) * per_page_num end_page = current_page* per_page_num
3、手动切片
（1）后端
def ab_many(request): # 分页 book_list = models.Book.objects.all() # 想访问哪一页 current_page = request.GET.get('page', 1) # 如果获取不到当前页码，就展示第一页 # 数据类型转换 try: current_page = int(current_page) except Exception: current_page = 1 # 每页展示多少条 per_page_num = 10 # 起始位置 start_page = (current_page - 1) * per_page_num # 终止位置 end_page = current_page * per_page_num # 计算总共需要多少页 all_count = book_list.count() # 增加高光点（当前页展示） page_count, more = divmod(all_count, per_page_num) if more: page_count += 1 page_html = '' xxx = current_page if current_page < 6: current_page = 6 for i in range(current_page-5,current_page+6): # 页码我们需要从1开始 if xxx == i: page_html += f'<li class="active"><a href="?page={i}">{i}</a></li>' else: page_html += f'<li><a href="?page={i}">{i}</a></li>' book_queryset = book_list[start_page:end_page] return render(request, 'ab_many.html', locals())
（2）前端
{% for book_obj in book_queryset %} <p>{{ book_obj.title }}</p> {% endfor %}
（3）路由访问
通过在 url 后面携带参数，完成分页操作 http://127.0.0.1:8000/ab_many/?page=3
三、自定义分页器的使用
当我们需要使用到非django内置的第三方功能或者组件代码的时候，我们一般情况下会创建一个名为utils文件夹，在该文件内对模块进行功能性划分。
utils可以在每个应用下创建。
我们到了后期封装代码的时候，不再局限于函数，还是尽量朝面向对象去封装我们自定义的分页器
1、自定义分页器封装代码（模版）
class Pagination(object): def __init__(self, current_page, all_count, per_page_num=2, pager_count=11): """ 封装分页相关数据 :param current_page: 当前页 :param all_count: 数据库中的数据总条数 :param per_page_num: 每页显示的数据条数 :param pager_count: 最多显示的页码个数 """ try: current_page = int(current_page) except Exception as e: current_page = 1 if current_page < 1: current_page = 1 self.current_page = current_page self.all_count = all_count self.per_page_num = per_page_num # 总页码 all_pager, tmp = divmod(all_count, per_page_num) if tmp: all_pager += 1 self.all_pager = all_pager self.pager_count = pager_count self.pager_count_half = int((pager_count - 1) / 2) @property def start(self): return (self.current_page - 1) * self.per_page_num @property def end(self): return self.current_page * self.per_page_num def page_html(self): # 如果总页码 < 11个： if self.all_pager <= self.pager_count: pager_start = 1 pager_end = self.all_pager + 1 # 总页码 > 11 else: # 当前页如果<=页面上最多显示11/2个页码 if self.current_page <= self.pager_count_half: pager_start = 1 pager_end = self.pager_count + 1 # 当前页大于5 else: # 页码翻到最后 if (self.current_page + self.pager_count_half) > self.all_pager: pager_end = self.all_pager + 1 pager_start = self.all_pager - self.pager_count + 1 else: pager_start = self.current_page - self.pager_count_half pager_end = self.current_page + self.pager_count_half + 1 page_html_list = [] # 添加前面的nav和ul标签 page_html_list.append(''' <nav aria-label='Page navigation>' <ul class='pagination'> ''') first_page = '<li><a href="?page=%s">首页</a></li>' % (1) page_html_list.append(first_page) if self.current_page <= 1: prev_page = '<li class="disabled"><a href="#">上一页</a></li>' else: prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page - 1,) page_html_list.append(prev_page) for i in range(pager_start, pager_end): if i == self.current_page: temp = '<li class="active"><a href="?page=%s">%s</a></li>' % (i, i,) else: temp = '<li><a href="?page=%s">%s</a></li>' % (i, i,) page_html_list.append(temp) if self.current_page >= self.all_pager: next_page = '<li class="disabled"><a href="#">下一页</a></li>' else: next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page + 1,) page_html_list.append(next_page) last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,) page_html_list.append(last_page) # 尾部添加标签 page_html_list.append(''' </nav> </ul> ''') return ''.join(page_html_list)
后端通过get方式实现分页功能，每次切换页的时候，会刷新页面。
后端通过post方式实现分页功能，每次切换页的时候，不会刷新页面，只会重新渲染下一页的内容。
2、get方法实现分页器功能（我比较常用）
（1）后端
from utils.mypage import Pagination def get_book(request): book_list = models.Book.objects.all() current_page = request.GET.get("page",1) try: current_page = int(current_page) except Exception: current_page = 1 # 前端传来的数据为字符串，所以后端异常捕获，为字符串的话转为int类型 all_count = book_list.count() page_obj = Pagination(current_page=current_page,all_count=all_count,per_page_num=10) page_queryset = book_list[page_obj.start:page_obj.end] return render(request,'booklist.html',locals())
（2）前端
<div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> {% for book in page_queryset %} <p>{{ book.title }}</p> {% endfor %} {{ page_obj.page_html|safe }} # ## 只需要这一句就可以，上面的的for循环是要分页的数据 </div> </div> </div>
3、post方法实现分页器功能
（1）前端
评论区分页开始 <body> <div class="pull-right"> {{ page_obj.page_html|safe }} </div> </body> <script> // 评论列表分页绑定点击事件 $('.btn_page').click(function () { // 获取当前点了第几页 var current_page = $(this).attr('current_page') var article_id = {{ article_obj.pk }} $('.active').removeClass('active'); $(this).parent().addClass('active'); $.ajax({ url: '/comment_page/', type: 'post', data: { current_page: current_page, 'article_id': article_id, 'csrfmiddlewaretoken': '{{ csrf_token }}' }, success: function (args) { let html = ''; if (args.code == 200) { //重新渲染一遍楼层页面， $.each(args.data, function (index, obj) { html +=`<li class="list-group-item"> <span style="margin-right: 10px"># ${obj.forloop}楼</span> <span style="margin-right: 10px">${obj.comment_time}</span> <span style="margin-right: 10px">${obj.username}</span> <span style="margin-right: 10px" class="pull-right"><a href="javascript:;" comment_username="${obj.username}" comment_id='${obj.pk}' class="reply">回复</a></span> <div class="content" style="margin-left: 14px"> ${obj.content} </div> </li>` }); $('.list-group').html(html); } } }) }) </script>
（2）后端
如果整个项目中多个地方需要用到分页功能，可以将上面的固定模板加入到utils文件夹，utils文件夹内可以放一些通用 的辅助函数，工具类和可重用的代码片段，这些片段不属于特定的模型，视图或者其他部分，可以被多个部分共享和复用。
# 评论区分页 from utils.mypage1 import Pagination page_obj = Pagination(current_page=request.GET.get('page', 1), all_count=comment_list.count(), per_page_num=5) comment_list = comment_list[page_obj.start:page_obj.end] def comment_page(request): # 根据当前第几页查询当前页的评论列表数据 if request.method == 'POST': back_dic = {'code': 200, 'msg': '查询成功'} # 接收参数(点的第几页) article_id = request.POST.get('article_id') current_page = request.POST.get('current_page') # 2 try: current_page = int(current_page) except Exception: current_page = 1 # 每页显示的条数 per_page_num = 5 start_page = (current_page - 1) * per_page_num end_page = current_page * per_page_num # 查询评论列表数据 comment_list = models.Comment.objects.filter(article_id=article_id).all()[start_page:end_page] # queryset对象 comment_list_obj = [] # [{},{},{}] i = current_page * per_page_num - (per_page_num - 1) # 翻页后顺序依次相加 for comment in comment_list: comment_list_obj.append({ 'forloop': i, 'pk': comment.pk, 'comment_time': comment.comment_time, 'username': comment.user.username, 'content': comment.content }) i += 1 back_dic['data'] = comment_list_obj return JsonResponse(back_dic)
合集:
Django炒面
分类:
Django框架学习
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· AI与.NET技术实操系列（六）：基于图像分类模型对图像进行分类