溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
為什么要實現分頁？
在大部分網站中分頁的功能都是必要的，尤其是在后臺管理中分頁更是不可或缺
分頁能帶給用戶更好的體驗，也能減輕服務器的壓力
對于分頁來說，有許多方法都可以實現
例如把數據全部讀取出來在前端用javascript實現，但這樣一次請求全部數據服務器壓力很大，
還有就是在后端實現，每一次請求部分數據顯示
分頁需求：
1. 每頁顯示的多少條數據
2. 頁面顯示多少個頁碼
3. 上一頁和下一頁
4. 首頁和尾頁
效果演示：
代碼實現：
分頁類封裝:
在我的app下創建一個page.py文件，進行封裝，我是先在我的app下創建了一個utils文件再創建page.py
class Pagination(object):
def __init__(self, current_page_num, all_count, request, per_page_num=10, pager_count=11):
"""
封裝分頁相關數據
:param current_page_num: 當前訪問頁的數字
:param all_count: 分頁數據中的數據總條數
:param per_page_num: 每頁顯示的數據條數
:param pager_count: 最多顯示的頁碼個數
"""
try:
current_page_num = int(current_page_num)
except Exception as e:
current_page_num = 1
if current_page_num < 1:
current_page_num = 1
self.current_page_num = current_page_num
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) # 5
# 保存搜索條件
import copy
self.params = copy.deepcopy(request.GET) # {"a":"1","b":"2"}
# 開始
@property
def start(self):
return (self.current_page_num - 1) * self.per_page_num
# 結束
@property
def end(self):
return self.current_page_num * 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_num <= self.pager_count_half:
pager_start = 1
pager_end = self.pager_count + 1
# 當前頁大于5
else:
# 頁碼翻到最后
if (self.current_page_num + self.pager_count_half) > self.all_pager:
pager_start = self.all_pager - self.pager_count + 1
pager_end = self.all_pager + 1
else:
pager_start = self.current_page_num - self.pager_count_half
pager_end = self.current_page_num + self.pager_count_half + 1
page_html_list = []
first_page = '<li><a href="?page=%s" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >首頁</a></li>' % (1,)
page_html_list.append(first_page)
if self.current_page_num <= 1:
prev_page = '<li class="disabled"><a href="#" rel="external nofollow" rel="external nofollow" >上一頁</a></li>'
else:
prev_page = '<li><a href="?page=%s" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >上一頁</a></li>' % (self.current_page_num - 1,)
page_html_list.append(prev_page)
# self.params=copy.deepcopy(request.GET) # {"a":"1","b":"2"}
for i in range(pager_start, pager_end):
self.params["page"] = i
if i == self.current_page_num:
temp = '<li class="active"><a href="?%s" rel="external nofollow" rel="external nofollow" >%s</a></li>' % (self.params.urlencode(), i)
else:
temp = '<li><a href="?%s" rel="external nofollow" rel="external nofollow" >%s</a></li>' % (self.params.urlencode(), i,)
page_html_list.append(temp)
if self.current_page_num >= self.all_pager:
next_page = '<li class="disabled"><a href="#" rel="external nofollow" rel="external nofollow" >下一頁</a></li>'
else:
next_page = '<li><a href="?page=%s" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一頁</a></li>' % (self.current_page_num + 1,)
page_html_list.append(next_page)
last_page = '<li><a href="?page=%s" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >尾頁</a></li>' % (self.all_pager,)
page_html_list.append(last_page)
return ''.join(page_html_list)
在視圖中使用
views.py
# 首先導入包
from myapp.utils.page import Pagination
from myapp.models import User
def index(request):
# queryset
user_list = User.objects.all()
# 總頁數
page_count = user_list.count()
# 當前頁
current_page_num = request.GET.get("page")
pagination = Pagination(current_page_num, page_count, request, per_page_num=1)
# 處理之后的數據
user_list = user_list[pagination.start:pagination.end]
content = {
"user_list": user_list,
"pagination": pagination,
}
return render(request, "user_list.html", content)
頁面顯示
user_list.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>index</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="external nofollow" > </head> <body> <div class="container"> <table class="table table-striped"> <thead> <tr> <th>name</th> </tr> </thead> <tbody> {% for user in user_list %} <tr> <td>{{ user.name }}</td> </tr> {% endfor %} </tbody> </table> <!-- bootstrap 樣式 --> <div class="dataTables_paginate paging_simple_numbers pull-right"> <ul class="pagination"> {{ pagination.page_html|safe }} </ul> </div> </div> </body> </html>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
