一.创建一个page.py

from django.utils.safestring import mark_safe
class Pagination(object):def __init__(self, current_page, all_count, base_url, query_params, per_page=30, pager_page_count=11):"""分页初始化:param current_page: 当前页码:param per_page: 每页显示数据条数:param all_count: 数据库中总条数:param base_url: 基础URL:param query_params: QueryDict对象，内部含所有当前URL的原条件:param pager_page_count: 页面上最多显示的页码数量"""self.base_url = base_urltry:self.current_page = int(current_page)if self.current_page <= 0:self.current_page = 1except Exception as e:self.current_page = 1query_params = query_params.copy()query_params._mutable = Trueself.query_params = query_paramsself.per_page = per_pageself.all_count = all_countself.pager_page_count = pager_page_countpager_count, b = divmod(all_count, per_page)if b != 0:pager_count += 1self.pager_count = pager_counthalf_pager_page_count = int(pager_page_count / 2)self.half_pager_page_count = half_pager_page_count@propertydef start(self):"""数据获取值起始索引:return:"""return (self.current_page - 1) * self.per_page@propertydef end(self):"""数据获取值结束索引:return:"""return self.current_page * self.per_pagedef page_html(self):"""生成HTML页码:return:"""if self.all_count == 0:return ""# 如果数据总页码pager_count<11 pager_page_countif self.pager_count < self.pager_page_count:pager_start = 1pager_end = self.pager_countelse:# 数据页码已经超过11# 判断： 如果当前页 <= 5 half_pager_page_countif self.current_page <= self.half_pager_page_count:pager_start = 1pager_end = self.pager_page_countelse:# 如果： 当前页+5 > 总页码if (self.current_page + self.half_pager_page_count) > self.pager_count:pager_end = self.pager_countpager_start = self.pager_count - self.pager_page_count + 1else:pager_start = self.current_page - self.half_pager_page_countpager_end = self.current_page + self.half_pager_page_countpage_list = []if self.current_page <= 1:prev = '<li><a href="#">上一页</a></li>'else:self.query_params['page'] = self.current_page - 1prev = '<li><a href="%s?%s">上一页</a></li>' % (self.base_url, self.query_params.urlencode())page_list.append(prev)for i in range(pager_start, pager_end + 1):self.query_params['page'] = iif self.current_page == i:tpl = '<li class="active"><a href="%s?%s">%s</a></li>' % (self.base_url, self.query_params.urlencode(), i,)else:tpl = '<li><a href="%s?%s">%s</a></li>' % (self.base_url, self.query_params.urlencode(), i,)page_list.append(tpl)if self.current_page >= self.pager_count:nex = '<li><a href="#">下一页</a></li>'else:self.query_params['page'] = self.current_page + 1nex = '<li><a href="%s?%s">下一页</a></li>' % (self.base_url, self.query_params.urlencode(),)page_list.append(nex)if self.all_count:tpl = "<li class='disabled'><a>共%s条数据，页码%s/%s页</a></li>" % (self.all_count, self.current_page, self.pager_count,)page_list.append(tpl)page_str = "".join(page_list)return mark_safe(page_str)

二. 使用

1.后端view

###############    分页组件固定用法     #############current_page = request.GET.get('page')page_object = page.Pagination(current_page=current_page,all_count=models.UserInfo.objects.all().count(),base_url=request.path_info,query_params=request.GET,per_page=10,)queryset = models.UserInfo.objects.all()[page_object.start:page_object.end]page_html = page_object.page_html()

2. 前端使用

<!--page_html是一个个li标签,需要在前端手动套一个ul标签,自己引入分页样式即可-->
{{ page_html}}

前后端不分离，分页器组件(python-dango)相关推荐

前后端不分离到分离演变,优势,前后端接口联调,排错
前后端分离,不分离简介前言前后端分离已成为互联网项目开发的业界标准使用方式,通过nginx+tomcat的方式(也可以中间加一个nodejs)有效的进行解耦,并且前后端分离会为以后的大型分布式架构 ...
express学生管理系统、前后端不分离（十一）
前言:构建学生系统,用到的技术栈有:express + mongodb + bootstrap + jquery (Ajax) 开发模式:首先ejs模板,前后端不分离最后ajax,前后端分离. 效果 ...
什么是前后端分离前后端不分离
前后端不分离前端页面看到的效果都是由后端控制,由后端渲染页面或重定向到其他页面,后端需要控制前端的展示,前后端耦合度很高. 这种应用模式比较适合纯网页应用,但是当后端对接APP时,APP可能并不需要 ...
前后端分离与前后端不分离的区别
前后端不分离在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高. 这种应用模式比较适合纯网页应用,但是当后端对 ...
guns企业高级单体版（前后端不分离）运行启动
单体版分前后端分离与不分离,这里分享前后端不分离的搭建方法访问guns官网https://www.stylefeng.cn,登录后可查看教程(账号密码见群公告) 官方教程不是最新的,有些地方写的不是 ...
MVT模型＜-＞前后端不分离前后端分离模板引擎
一.前后端不分离与前后端分离的比较前后端不分离特点: 后端需控制数据的展示前后端不分家,耦合严重返回的是HTML页面,适应性.拓展性差只能用于浏览器,其它终端不匹配前后端分离的特点: 当前主 ...
springBoot前后端不分离Vue+elementUI脚手架
新建SpringBoot2.4.4项目. 目录结构如下新建html页面 login.js文件接口完整项目在我的资源中SpringBoot前后端不分离vue+element脚手架_springbo ...
网站架构模式：前后端分离与前后端不分离
前后端不分离在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高. 这种模式比较适合纯网页应用,但是当后端对接A ...
前后端分离开发的理解以及和前后端不分离的区别
一.前后端分离的概念前后端分离前后端分离是一种架构模式,说通俗点就是后端项目里面看不到页面(JSP | HTML),后端给前端提供接口,前端调用后端提供的 REST 风格接口就行,前端专注写页面( ...
shiro原理/流程（前后端不分离）
1.整体流程 1>subject 封装了用户名密码,用户权限,用户角色等信息 2>securitymanager负责进行校验用户名密码,权限等操作 3>realm,相当于securi ...

前后端不分离，分页器组件(python-dango)

一.创建一个page.py

二. 使用

1.后端view

2. 前端使用

前后端不分离，分页器组件(python-dango)相关推荐

最新文章

热门文章