DJango自帶組件,利用paginator模塊實現分頁

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>