Python---Flask--06--分頁的實現

自動分頁

flask自帶paginate分頁

paginate屬性

- 當前頁面(屬性)
    page  
- 當前頁面中的記錄(屬性)
    items
- 上一頁頁碼(屬性)
    prev_num
- 下一頁頁碼(屬性)
    next_num
- 如果有上頁返回True(屬性)
    has_prev
- 如果有下頁返回True(屬性)
    has_next
- 查詢得到總頁數(屬性)
    pages
- 每一頁顯示記錄的數量(屬性)
    per_page  
- 查詢返回的記錄總數(屬性)
    total
    
@blue.route('/goodslist/<int:num>/<int:per>/')
def goodslist(num,per):
    paginate = Goods.query.paginate(num,per)
 
    return render_template('goodslist.html', paginate=paginate)

paginate中的方法

• prev() 上一頁的分頁對象Pagination
• next() 下一頁的分頁對象Pagination
• iter_pages(left_edge=2,left_current=2,right_current=5,right_edge=2)
• iter_pages 用來獲得針對當前頁的應顯示的分頁頁碼列表。
  假設當前共有100頁，當前頁為50頁，按照默認的參數設置調用iter_pages獲得的列表為：
  [1,2,None,48,49,50,51,52,53,54,55,None,99,100]

渲染模板

<!--定義一個分頁宏-->
{% macro my_paginate(pagination, url) %}
 <nav class="pagination">
    <ul>
      {%if pagination.has_prev%}
    <li class="page-item active"><a class="page-link" href="{{url_for(url,page=pagination.page-1)}}">上一頁</a></li>
    {%else%}
    <li class="page-item disabled"><a class="page-link" href="#">上一頁</a></li>
    {%endif%}

        {%for page in pagination.iter_pages(1,1,3,1)%}
        {%if page%}
            <li class="page-item {%if page==pagination.page%}active{%endif%}"><a class="page-link" href="{{url_for(url,page=page)}}">{{page}}</a></li>
        {%else%}
            <li class="page-item disabled"><a class="page-link" href="#">&hellip;</a></li>
        {%endif%}

    {%endfor%}

    {%if pagination.has_next%}
    <li class="page-item active"><a class="page-link" href="{{url_for(url,page=pagination.page+1)}}">下一頁</a></li>
    {%else%}
    <li class="page-item disabled"><a class="page-link" href="#">下一頁</a></li>
    {%endif%}
    </ul>
 </nav>
{% endmacro %}

宏的使用

{% extends '/home/layout/base.html' %}
{% import '/home/layout/page.html' as pg %}
{% block content %}
<div class="content">
      <div class="jumbotron">
        <h1>歡迎訪問博客</h1>
        <p>在這里可以看到前端技術，后端程序，網站內容管理系統等文章，還有我的程序人生！</p>
      </div>
      <div id="focusslide" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
          <li data-target="#focusslide" data-slide-to="0" class="active"></li>
          <li data-target="#focusslide" data-slide-to="1"></li>
          <li data-target="#focusslide" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner" role="listbox">
          <div class="item active"> <a href="" target="_blank"><img src="{{ url_for('static', filename='images/banner/banner_01.jpg')}}" alt="" class="img-responsive"></a>
            <!--<div class="carousel-caption"> </div>-->
          </div>
          <div class="item"> <a href="" target="_blank"><img src="{{ url_for('static', filename='images/banner/banner_02.jpg')}}" alt="" class="img-responsive"></a>
            <!--<div class="carousel-caption"> </div>-->
          </div>
          <div class="item"> <a href="" target="_blank"><img src="{{ url_for('static', filename='images/banner/banner_03.jpg')}}" alt="" class="img-responsive"></a>
            <!--<div class="carousel-caption"> </div>-->
          </div>
        </div>
        <a class="left carousel-control" href="#focusslide" role="button" data-slide="prev" rel="nofollow"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">上一個</span> </a> <a class="right carousel-control" href="#focusslide" role="button" data-slide="next" rel="nofollow"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">下一個</span> </a> </div>
      <article class="excerpt-minic excerpt-minic-index">
        <h2><span class="red">【今日推薦】</span><a href="" title="">從下載看我們該如何做事</a></h2>
        <p class="note">一次我下載幾部電影，發現如果同時下載多部要等上幾個小時，然后我把最想看的做個先后排序，去設置同時只能下載一部，結果是不到一杯茶功夫我就能看到最想看的電影。 這就像我們一段時間內想干成很多事情，是同時干還是有選擇有順序的干，結果很不一樣。同時...</p>
      </article>
      <div class="title">
        <h3>最新發布</h3>
        <div class="more"><a href="">PHP</a><a href="">JavaScript</a><a href="">EmpireCMS</a><a href="">Apache</a><a href="">MySQL</a></div>
      </div>
      {% for article in paginate.items %}
      <article class="excerpt excerpt-1">
          <a class="focus" href="article.html" title="">
              <img class="thumb" data-original="images/excerpt.jpg" src="{{ article.cover_url }}" alt="">
          </a>
        <header><a class="cat" href="program">后端程序<i></i></a>
          <h2><a href="{{url_for('home.show', id=article.id)}}" title="">{{article.title}}</a></h2>
        </header>
        <p class="meta">
          <time class="time"><i class="glyphicon glyphicon-time"></i>{{ article.add_time }}</time>
          <span class="views"><i class="glyphicon glyphicon-eye-open"></i> 共120人圍觀</span>
          <a class="comment" href="article.html#comment"><i class="glyphicon glyphicon-comment"></i> 0個不明物體</a>
        </p>
        <p class="note">可以用strtotime()把日期（$date）轉成時間戳，再用date()按需要驗證的格式轉成一個日期，來跟$date比較是否相同來驗證這個日期的格式是否是正確的。所以要驗證日期格式 ... </p>
      </article>
      {% endfor %}
    <!--分頁-->
     {{ pg.my_paginate(paginate, 'home.blog_list')}}
    </div>
{% endblock %}

手動

@blue.route('/goodslist/<int:num>/<int:per>/')
def goodslist(num,per):
    # 第num頁
    # 每頁顯示per行
    goods = Goods.query.offset((num-1) * per).limit(per)
    
    return render_template('goodslist.html', goods=goods