django有一個自帶的分頁,雖然功能很全面,但是不適合我應用的場景,所以自己寫了一個代碼 拿走不謝!
發現了了bug 筆者正在修復 美化 修復好了在上傳
應用的場景 :
1.最好是 django中使用
2. 分頁索要的數據 你必須給全
3. 輸出的是一個字典 和 一個分頁的字符串類型代碼
效果圖:
使用的頁碼劇中飄紅效果,就是后邊的樣式沒有調好,我不專業,你自己調一下吧 
使用方法:
拿到下面的組件,放到一個文件夾里面
views.py要引入一下
因為我的page
滿足條件了之后,前端頁面這么寫組件返回的數據是樣的,是一個字典,que是querryswt類型,new_html是一個分頁組件 所以前端這么寫就行了
1 """ 2 啟動調用的函數是 my_html() 3 需要的參數是 4 param que: 一個querryset類型的數據 5 new_num_page: 要跳轉的的頁碼 6 href:拼接路徑 7 8 9 """ 10 def html(new_lis,new_num_page,page_num,href): 11 """ 12 :param new_lis: 13 :param new_num_page: 14 :param page_num: 15 :param href: 傳入的拼接路徑比如 /custorm/?page= 16 :return: 17 """ 18 page_html = "" 19 page_pre_html = f'<nav aria-label="Page navigation"><ul class="pagination "><li><a href="{href}1" aria-label="Previous"><span aria-hidden="true">首頁</span></a></li><li><a href="{href}{new_num_page - 1}" aria-label="Previous"><span aria-hidden="true">«</span></a></li>' 20 page_html += page_pre_html 21 for i in new_lis: 22 if i == str(new_num_page): 23 page_html += f'<li ><a href="{href}{i}" style="color:red" >{i}</a></li>' 24 else: 25 page_html += f'<li ><a href="{href}{i}" >{i}</a></li>' 26 27 pagenum_html = f'<li><a href="{href}{new_num_page + 1}" aria-label="Next"><span aria-hidden="true" >»</span></a></li><li><a href="{href}{page_num}" aria-label="pattern"><span aria-hidden="true">尾頁</span></a></li><li><span aria-hidden="true" ><form action="" method="get" ><input type="text" style="width:80px;height:18px;" placeholder="共:{page_num}頁" name="page" ><input type="submit" style="width:80px;height:18px;" value="跳轉"></form></li></ul></nav>' 28 page_html += pagenum_html 29 return page_html 30 31 #收入數據,做成字典傳出去 32 def my_html(que,new_num_page,href,page_max_piece=10,page_tag_num=5):# param que: 一個querry類型的數據new_num_page: 新的頁碼 href:拼接路徑 33 """ 34 :param que: 一個querry類型的數據 35 :param new_num_page: 新的頁碼 36 href:拼接路徑 37 :param page_max_piece: 頁面顯示的最大條數 38 :param page_tag_num: 頁面顯示的頁碼數 最好是奇數 輕易別改 39 :return: 返回一個字典 攜帶切片好的querry 和 一個 網頁的html 直接返回前段就可以用了 40 """ 41 all_data_count = que.count() 42 page_num, resid = divmod(all_data_count, page_max_piece) # 商數和余數 43 if resid: 44 page_num += 1 # 拿到了總頁數 45 page_all_lis = [str(i) for i in range(1, page_num + 1)] 46 if new_num_page in page_all_lis: 47 new_num_page = int(new_num_page) 48 if new_num_page > 2 and new_num_page < page_num - 1: 49 ret = html(page_all_lis[new_num_page-3:new_num_page+2],new_num_page,page_num,href) 50 elif new_num_page <= page_tag_num: 51 ret = html(page_all_lis[ 0:page_tag_num], new_num_page, page_num,href) 52 elif new_num_page > page_num-2: 53 ret = html(page_all_lis[page_num-page_tag_num:page_num],new_num_page,page_num,href) 54 return {"que": que[(new_num_page - 1) * page_max_piece:new_num_page * page_max_piece], "new_html": ret} 55 else: 56 new_num_page=1 57 ret = html(page_all_lis[0:page_tag_num], new_num_page, page_num,href) 58 return {"que": que[(new_num_page - 1) * page_max_piece:new_num_page * page_max_piece], "new_html": ret}