簡體   English   中英

rails will_paginate僅顯示當前頁面鏈接

[英]rails will_paginate display current page link only

有什么辦法可以讓我僅顯示當前頁面鏈接,其中當我位於首頁時隱藏<<上一個鏈接,而當我位於最后一頁時隱藏下一個>>鏈接。
應該如下

第一頁: 1 | 下一個>>

最后一頁(因為有4頁): <<上一頁| 4

任何中心頁面的示例: <<上一頁| 3 | 下一個>>

目前我得到的是: <<上一頁| 1 ... 4 | 下一個>>

我的密碼

<%= will_paginate @blogs, :class=>"pagination_links",:page_links => true, :next_label => "<span>|&nbsp</span>Next >>",:previous_label => "<< Previous<span>&nbsp|</span>",:inner_window   => 0, :outer_window => 0 %> 

生成的html是

<div class="pagination_links">
<span class="previous_page disabled">
<< Previous
<span> |</span>
</span>
<em class="current">1</em>
<span class="gap">…</span>
<a href="/blog?page=4">4</a>
<a class="next_page" href="/blog?page=2" rel="next">
<span>| </span>
Next >>
</a>
</div>

有什么解決辦法嗎?

目前無法使用默認的API選項,但是will_paginate允許您創建自定義鏈接渲染器。

為此,將renderer鍵添加到will_paginate函數中,並告訴它要使用的渲染器。

 <%= will_paginate @pages, renderer: PaginationLinkRenderer, previous_label:"« Previous |", next_label:"| Next »" %>

並在helpers /或lib /中創建一個名為pagination_link_renderer.rb並添加以下內容:

class PaginationLinkRenderer < WillPaginate::ActionView::LinkRenderer

  protected

  def page_number(page)
   if page == current_page
     page
   end
  end

  def previous_or_next_page(page, text, classname)
    if page
      link(text, page, class: classname)
    end
  end

end

我使用CSS實現了

   .current {
        display: inline-block;
        font-size: 12px;
        text-decoration: none;
        color: #000000;
    }
    .gap{
        display : none !important;
    }
    .pagination_links a{
        display:none;
    }
    .next_page,.previous_page{
        display:inline-block !important;
        color: #3343A0;
    }
    .pagination_links{
        text-align: center;
    }
    .previous_page.disabled, .next_page.disabled{
        display: none !important;
    }        
    .pagination_links a{
        text-decoration: none;
    }
    .pagination_links a:hover{
        text-decoration: underline;
    }
    .pagination_links span{
        text-decoration: none;
        display: inline-block;
        color: #000000;
    }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM