DJango自带有组件Paginator,实现分页功能。
何为分页,就是为了实现如下效果,显示内容,能够跳转到指定页码。
分页其实需要两个重要的内容:
- 当前显示内容:指定的页码也就是显示的当前页的显示数据
- 页码条码显示:一般UI会显示上一页、下一页、页码数
后台给前台传递数据,前台直接显示就行。
- 基本了解
Paginator类,大家自行看下api,基本需要连接下
- 基本API熟悉
paginator = Paginator(book_list,5) # 先拿到分页器对象,第一个参数:对象列表,第二个参数:每页显示的条数
paginator.count # 总条数
paginator.num_pages # 总页数
paginator.page_range # 页码数列表
current_page = paginator.page(5) # 取某一页,返回一个对象
current_page.object_list # 某一页里所有数据,例如:这是第5也所有数据 主要在ui[*.html]页面上面显示数据
current_page.has_next() # 是否有下一页
current_page.has_previous() # 是否有上一页
current_page.next_page_number() # 下一页的页码数
current_page,previous_page_number() # 上一页的页码数
- 基本使用
# Create your views here.
def index(request):
# 往数据库表中插入数据
# book_list=[]
# for i in range(100):
# book_obj = Book(title="Book_%s"%i,price=i*i)
# book_list.append(book_obj)
# Book.objects.bulk_create(book_list)
# return HttpResponse('插入数据OK!')
book_list = Book.objects.all()
# 先拿到分页器对象,第一个参数:对象列表,第二个参数:每页显示的条数
paginator = Paginator(book_list, 5) # 实例化一个分页对象,设置每一页显示5条
# 返回Page具有给定的从1开始的索引对象,同时还处理超出范围和无效页码,如果页码不是数字,
# 则返回第一页。如果页码为负数或大于页数,则返回最后一页
c_page = request.GET.get("page", 1) #返回当前页码数,第几页
currentPage = int(c_page) # 当前页码
print("count", paginator.count) # 数据源总记录数
print("num_pages", paginator.num_pages) # 总页数
print("page_range", paginator.page_range) # 页码的列表:页码迭代器
if paginator.num_pages > 10:
if currentPage - 5 < 1:
pageRange = range(1, 11) # 页码迭代器的方法
elif currentPage + 5 > paginator.num_pages:
pageRange = range(currentPage - 5, paginator.num_pages + 1)
else:
pageRange = range(currentPage - 5, currentPage + 5)
else:
pageRange = paginator.page_range # 页码迭代器 同range
try:
page = paginator.page(c_page) # 取某一页,返回一个对象:前端再用page.object_list 获取对象里面所有数据
except:
page = paginator.page(1) # 第一页的page对象
print(page.has_next()) # 是否有下一页
print(page.next_page_number()) # 下一页页码
print(page.has_previous()) # 是否有上一页
print(page.previous_page_number()) # 上一页页码
#返回了4个参数
# 1、 取某一页,返回一个对象:前端再用page.object_list 获取对象里面所有数据
# 2、paginator:分页器对象
# 3、c_page:当前页码数
# 4、pageRange:显示的页码数集合
return render(request, "index.html",
{"page": page, "paginator": paginator, "c_page": currentPage, "pageRange": pageRange})
仔细看一下每一行的注释即可,这里传递给UI的部分数据,UI需要显示什么内容就传递什么内容
- UI展示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<title>index</title>
</head>
<body>
{% csrf_token %}
<ul>
{% for book in page.object_list %}
<p>{{ book.title }}:{{ book.price }}</p>
{% endfor %}
</ul>
<nav aria-label="Page navigation">
<ul class="pagination">
{######################### 上一页#########################}
{% if page.has_previous %}
<li><a href="?page={{ c_page|add:-1 }}">上一页</a></li>
{% else %}
<li class="disabled"><a aria-label="Next">上一页</a></li>
{% endif %}
{######################### 页码#########################}
{% for num in pageRange %}
{% if c_page == num %}
<li class="active"><a href="?page{{ num }}">{{ num }}</a></li>
{% else %}
<li><a href="?page={{ num }}">{{ num }}</a></li>
{% endif %}
{% endfor %}
{######################### 下一页#########################}
{% if page.has_next %}
<li><a href="?page={{ c_page|add:+1 }}">下一页</a></li>
{% else %}
<li class="disabled"><a aria-label="Next">下一页</a></li>
{% endif %}
</ul>
</nav>
</body>
</html>
对于组件Paginator的使用,需要views层和template层对照着写,需要哪些数据然后显示;Paginator其实也是对数据封装成了对象,便于api调用分页;当然也可以在template层用前端组件分页实现,都可以的。