CRM之分頁
- 2020 年 1 月 17 日
- 筆記
分頁簡介
分頁功能在網頁中是非常常見的一個功能，其作用也就是將數據分割成多個頁面來進行顯示。
使用場景： 當取到的數據量達到一定的時候，就需要使用分頁來進行數據分割。
當我們不使用分頁功能的時候，會面臨許多的問題：
客戶端的問題： 如果數據量太多，都顯示在同一個頁面的話，會因為頁面太長嚴重影響到用戶的體驗，也不便於操作，也會出現載入太慢的問題。
服務端的問題： 如果數據量太多，可能會造成記憶體溢出，而且一次請求攜帶的數據太多，對伺服器的性能也是一個考驗。
例子:
用類的方式:
在後台進行分頁
1.首先在項目根目錄下創建一個utils包, 創建pagination.py文件
# pagination.py
class Pagination: def __init__(self, page_num, all_count, per_num=11, max_page=10): """ :param page_num: 當前頁數 :param all_count: 總數據量 :param per_num: 每頁顯示的數據量 :param max_page: 顯示最大頁碼數, 默認為10頁 """ # 獲取頁碼 try: self.page_num = int(page_num) if self.page_num <= 0: self.page_num = 1 except Exception as e: self.page_num = 1 # 每頁顯示的數據 self.per_num = per_num # 總數據量 self.all_count = all_count # 總頁數 # divmod(a, b) 返回一個包含商和餘數的元組(a // b, a % b)。 self.page_count, more = divmod(all_count, per_num) if more: self.page_count += 1 # 顯示最大頁碼數 self.max_page = max_page self.half_page = max_page // 2 @property def page_html(self): if self.page_count < self.max_page: page_start = 1 page_end = self.page_count else: if self.page_num <= self.half_page: page_start = 1 page_end = self.max_page elif self.page_num + self.half_page >= self.page_count: page_start = self.page_count - self.max_page + 1 page_end = self.page_count else: page_start = self.page_num - self.half_page # 2 page_end = self.page_num + self.half_page # 7 + page_list = [] # 控制頁數不能低於1 if self.page_num == 1: page_list.append('<li class="disabled"><a href="?page={}">上一頁</a></li>'.format(self.page_num)) else: page_list.append('<li><a href="?page={}">上一頁</a></li>'.format(self.page_num - 1)) for page in range(page_start, page_end + 1): if page == self.page_num: page_list.append('<li class="active"><a href="?page={}">{}</a></li>'.format(page, page)) else: page_list.append('<li><a href="?page={}">{}</a></li>'.format(page, page)) # 控制不能超過總頁數 if self.page_num == self.page_count: page_list.append('<li class="disabled"><a href="?page={}">下一頁</a></li>'.format(self.page_count)) else: page_list.append('<li><a href="?page={}">下一頁</a></li>'.format(self.page_num + 1)) return ''.join(page_list) @property def start(self): return (self.page_num - 1) * self.per_num @property def end(self): return self.page_num * self.per_num
# views.py from django.shortcuts import render, reverse, redirect, HttpResponse from utils.pagination import Pagination # 模擬數據 users = [{'name': 'Jerry{}'.format(i), 'pwd': '123'} for i in range(1, 302)] def user_list(request): """ 一頁顯示20 第1頁 0 20 第2頁 20 40 n (n-1)*20 20*n :param request: :return: """ page = Pagination(request.GET.get('page', '1'), len(users)) return render(request, 'user_list.html',{'users':users[page.start:page.end],'page_html':page.page_html })
# user_list.html 網頁文件 {% extends 'layout.html' %} # 繼承了一個模板 {% block content %} <table class="table table-hover table-bordered"> {% for foo in users %} <tr> <td>{{ foo.name }}</td> <td>{{ foo.pwd }}</td> </tr> {% endfor %} </table> <nav aria-label="Page navigation"> <ul class="pagination"> {{ page_html|safe }} </ul> </nav> {% endblock %}
效果圖:
函數的方式:
# views.py # 模擬數據 users = [{'name': 'Jerry{}'.format(i), 'pwd': '123'} for i in range(1, 302)]
def user_list(request): """ 一頁顯示20 第1頁 0 20 第2頁 20 40 n (n-1)*20 20*n :param request: :return: """ # 獲取頁碼 try: page_num = int(request.GET.get('page', '1')) if page_num <= 0: page_num = 1 except Exception as e: page_num = 1 # 每頁顯示的數據 per_num = 10 # 總數據量 all_count = len(users) # 總頁數 # divmod(a, b) 返回一個包含商和餘數的元組(a // b, a % b)。 page_count, more = divmod(all_count, per_num) if more: page_count += 1 # 顯示最大頁碼數 max_page = 11 half_page = max_page // 2 # python中循環 if page_count < max_page: page_start = 1 page_end = page_count else: if page_num <= half_page: page_start = 1 page_end = max_page elif page_num + half_page >= page_count: page_start = page_count - max_page + 1 page_end = page_count else: page_start = page_num - half_page # 2 page_end = page_num + half_page # 7 + page_list = [] # 控制頁數不能低於1 if page_num == 1: page_list.append('<li class="disabled"><a href="?page={}">上一頁</a></li>'.format(page_num)) else: page_list.append('<li><a href="?page={}">上一頁</a></li>'.format(page_num - 1)) for page in range(page_start, page_end + 1): page_list.append('<li><a href="?page={}">{}</a></li>'.format(page, page)) # 控制不能超過總頁數 if page_num == page_count: page_list.append('<li class="disabled"><a href="?page={}">下一頁</a></li>'.format(page_count)) else: page_list.append('<li><a href="?page={}">下一頁</a>>下一頁</li>'.format(page_num + 1)) page_html = ''.join(page_list) return render(request, 'user_list.html', {"users": users[(page_num - 1) * per_num:page_num * per_num], 'page_html': mark_safe(page_html)})
# user_list.html {% extends 'layout.html' %} {% block content %} <table class="table table-hover table-bordered"> {% for foo in users %} <tr> <td>{{ foo.name }}</td> <td>{{ foo.pwd }}</td> </tr> {% endfor %} </table> <nav aria-label="Page navigation"> <ul class="pagination"> {{ page_html }} </ul> </nav> {% endblock %}
