当前位置: 首页 > news >正文

django项目中通用的分页组件

文章目录

  • 分页组件
    • pager组件代码

分页组件

应用分页组件,需要以下两个步骤:

  1. 视图函数中:(先获取queryset,将request和queryset传入分页组件对象中,得到生成的html标签)

    def customer_list(request):# 所有数据queryset = models.Customer.objects.filter(active=1).select_related('level')pager = Pagination(request, queryset)context = {"queryset": queryset[pager.start:pager.end],"pager_string": obj.html()}return render(request, 'customer_list.html', context)
    
  2. 在页面上:(直接引用即可)

    {% for row in pager.queryset %}{{row.id}}{{row.id}}{{row.id}}......
    {% endfor %}<ul class="pagination">{{ pager.html }}
    </ul>
    

pager组件代码

import copy
from django.utils.safestring import mark_safeclass Pagination(object):""" 分页 """def __init__(self, request, query_set, per_page_count=10):""":param request: 需要用request对象中的GET中的数据进行校验和处理:param query_set: 查询数据库得到的查询集:param per_page_count: 每页显示几条数据"""# 防止分页操作对后续的使用request.GET有影响self.query_dict = copy.deepcopy(request.GET)# 将self.query_dict._mutable设置为True:表示query_dict可修改,默认为Falseself.query_dict._mutable = True# 拿到总数据据数self.query_set = query_settotal_count = query_set.count()self.total_count = total_count# 计算出总共有多少页面self.total_page, div = divmod(total_count, per_page_count)if div:self.total_page += 1# 对url中的请求参数进行校验处理,决定显示那一页page = request.GET.get('page')if not page:page = 1else:if not page.isdecimal():page = 1else:page = int(page)if page <= 0:page = 1else:if page > self.total_page:page = self.total_pageself.page = page# 每页数据条数self.per_page_count = per_page_count# 页面第一条数据self.start = (page - 1) * per_page_count# 页面最后一条数据self.end = page * per_page_countdef html(self):""":return: 生成的当前页面的分页栏html"""pager_list = []if not self.total_page:return ""# 求出生成的分页栏html显示的页面范围if self.total_page <= 11:# 总页码小于11start_page = 1end_page = self.total_pageelse:# 总页码比较多# 判断当前页 <=6: 1~11if self.page <= 6:start_page = 1end_page = 11else:if (self.page + 5) > self.total_page:# 显示最后10页start_page = self.total_page - 10end_page = self.total_pageelse:# 显示前后5页start_page = self.page - 5end_page = self.page + 5# 添加url中的参数,而不是替换:?&age=19&name=123&page=1# 首页self.query_dict.setlist('page', [1])pager_list.append('<li><a href="?{}">首页</a></li>'.format(self.query_dict.urlencode()))# 上一页if self.page > 1:self.query_dict.setlist('page', [self.page - 1])pager_list.append('<li><a href="?{}">上一页</a></li>'.format(self.query_dict.urlencode()))# 当前页+前后5页for i in range(start_page, end_page + 1):self.query_dict.setlist('page', [i])if i == self.page:item = '<li class="active"><a href="?{}">{}</a></li>'.format(self.query_dict.urlencode(), i)else:item = '<li><a href="?{}">{}</a></li>'.format(self.query_dict.urlencode(), i)pager_list.append(item)# 下一页if self.page < self.total_page:self.query_dict.setlist('page', [self.page + 1])pager_list.append('<li><a href="?{}">下一页</a></li>'.format(self.query_dict.urlencode()))# 尾页self.query_dict.setlist('page', [self.total_page])pager_list.append('<li><a href="?{}">尾页</a></li>'.format(self.query_dict.urlencode()))pager_list.append('<li class="disabled"><a>数据{}条{}页</a></li>'.format(self.total_count, self.total_page))pager_string = mark_safe("".join(pager_list))return pager_stringdef queryset(self):""":return: 生成的当前页面的展示数据"""if self.total_count:return self.query_set[self.start:self.end]return self.query_set

可能用到django框架中QueryDict知识点,可以看看Django框架中的:QueryDict(处理url参数)

若有错误与不足请指出,关注DPT一起进步吧!!!

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • 【深度学习实践】基于深度学习的图像去雾算法-ChaIR-实践
  • Unity游戏开发
  • unity 本地使用Json(全套)
  • JMeter常见的高频面试题整理
  • RCE漏洞函数
  • RCE漏洞复现
  • 入门岛2-python实现wordcount并进行云端debug
  • git中如何修改提交信息(版本号)
  • Linux系统安全及应用(一):密码安全、命令历史限制、终端自动注销、su命令和限制su命令
  • 停止项目大小调整,开始搜索层自动缩放!
  • HarmonyOS.FA开发流程
  • 企业微信推送消息的Java实现教程
  • 解决svn上传代码,遇到文件冲突的问题
  • Python必备——高效配置与使用Pip换源
  • C++ | Leetcode C++题解之第331题验证二叉树的前序序列化
  • 【React系列】如何构建React应用程序
  • 2017前端实习生面试总结
  • CSS选择器——伪元素选择器之处理父元素高度及外边距溢出
  • ES6系列(二)变量的解构赋值
  • extjs4学习之配置
  • gcc介绍及安装
  • Git初体验
  • JAVA_NIO系列——Channel和Buffer详解
  • JavaScript创建对象的四种方式
  • Linux CTF 逆向入门
  • spring + angular 实现导出excel
  • Spring Boot快速入门(一):Hello Spring Boot
  • Vue2.0 实现互斥
  • Webpack 4 学习01(基础配置)
  • 记一次用 NodeJs 实现模拟登录的思路
  • 前端每日实战:61# 视频演示如何用纯 CSS 创作一只咖啡壶
  • 小程序滚动组件,左边导航栏与右边内容联动效果实现
  • 一个项目push到多个远程Git仓库
  • ​Python 3 新特性:类型注解
  • ​软考-高级-系统架构设计师教程(清华第2版)【第12章 信息系统架构设计理论与实践(P420~465)-思维导图】​
  • (12)Linux 常见的三种进程状态
  • (k8s中)docker netty OOM问题记录
  • (附源码)spring boot校园健康监测管理系统 毕业设计 151047
  • (转)清华学霸演讲稿:永远不要说你已经尽力了
  • (转载)OpenStack Hacker养成指南
  • *Django中的Ajax 纯js的书写样式1
  • .Net Core和.Net Standard直观理解
  • .net core控制台应用程序初识
  • .NET/C# 在 64 位进程中读取 32 位进程重定向后的注册表
  • .sh 的运行
  • .sh文件怎么运行_创建优化的Go镜像文件以及踩过的坑
  • @RequestBody与@RequestParam
  • [ C++ ] STL_stack(栈)queue(队列)使用及其重要接口模拟实现
  • [ 环境搭建篇 ] 安装 java 环境并配置环境变量(附 JDK1.8 安装包)
  • []error LNK2001: unresolved external symbol _m
  • [24年新算法]NRBO-XGBoost回归+交叉验证基于牛顿拉夫逊优化算法-XGBoost多变量回归预测
  • [Android]常见的数据传递方式
  • [BZOJ 3680]吊打XXX(模拟退火)
  • [C#]winform基于opencvsharp结合Diffusion-Low-Light算法实现低光图像增强黑暗图片变亮变清晰
  • [C#]使用C#部署yolov8的目标检测tensorrt模型