目的：是為了實現列表分頁
1、定制URL
http://127.0.0.1:8000/blog/get_article?page=3
之前定制URL是在url后增加了/id，這次使用參數的方式
def get_article(request): page=request.GET.get('page');---------->使用GET.get方法來獲取URL后的page參數的值，同理，如果將來url后跟了其他更多的參數，也可以使用這種方法指定返回 if page:------------------->此處可以簡單對page進行處理，因為使用get返回的值是Str類型，需要轉成int page=int(page); else: page=1;--------->默認為1 print('PAGE 參數為：',page);
2、引入Djanjo的分頁組件
from django.core.paginator import Paginator;--------->重點，這就是Django的分頁組件 #列表頁 def get_article(request): page=request.GET.get('page'); if page: page=int(page); else: page=1; print('PAGE 參數為：',page); article_list=Article.objects.all(); #實例化一個分頁組件，第一個參數是需要被分頁的列表，第二個參數是每一個的item個數，比如這邊指定每頁個數為2 paginator=Paginator(article_list,2); #page方法，傳入一個參數，表示第幾頁的列表，這邊傳入的page，是你在地址中寫的參數 page_article_list=paginator.page(page);----------------->獲得指定page的列表 page_num=paginator.num_pages;------------------->獲得列表被分頁處理后，總共被分為多少頁 #print('page_num:',page_num); #判斷是否存在下一頁 if page_article_list.has_next(): next_page=page+1; else: next_page=page;
#是否存在上一頁 if page_article_list.has_previous(): previous_page=page-1; else: previous_page=page; return render(request,'index.html',{
#根據前端，我們需要知道當前page的列表，需要知道點擊【上一頁】，跳轉，點擊下一頁的跳轉，需要知道被分了幾頁 'article_list':page_article_list,------->當前page的list 'page_num':range(1,page_num+1),---------->被分了幾頁，這個返回一個數組，前端直接for循環渲染 'curr_page':page,---------->當前頁數 'next_page':next_page,---------->下一頁 'previous_page':previous_page————————————————>上一頁 })
3、前端修改
引入bootstrap的分頁代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>主頁--文章列表頁</title> <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- 可選的 Bootstrap 主題文件（一般不用引入） --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> </head> <body> <div class="container page-header"> <h1>文章列表 <small>by zhonghuihong </small></h1> </div> <div class="container page-body"> <div class="col-md-9" role="main"> <div class="body-main"> <div> {% for article in article_list %} <h2><a href="get_detail/{{ article.article_id }}">{{article.article_title}}</a></h2> <p>{{article.article_content}}</p> {% endfor %} </div> </div> <div class="body-footer"> <div class="col-md-4 col-md-offset-3"> <nav aria-label="Page navigation"> <ul class="pagination"> <li> <a href="/blog/get_article?page={{ next_page }}" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> {% for num in page_num %} <li> <a href="/blog/get_article?page={{ num }}">{{ num }}</a> </li> {% endfor %} <li> <a href="/blog/get_article?page={{ previous_page }}" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> </ul> </nav> </div> </div> </div> <div class="col-md-3" role="complementary"> <div><h2>最新文章</h2> {% for article in article_list %} <h4><a href="get_detail/{{ article.article_id }}">{{article.article_title}}</a></h4> {% endfor %} </div> </div> </div> </body> </html>
4、調試驗收--確認功能正常無報錯
耶！！！繼續努力