8
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【Rails】kaminariでページネーションを実装

Last updated at Posted at 2020-01-12

##基本

Gemfile
gem 'kaminari'
$ bundle install
Controller
def hoge
  @users = User.page(params[:page]).per(10)
end
View
<%= paginate @users %>

##日本語化
localeファイルを作り、以下を記述。

config/locales/kaminari_ja.yml
ja:
  views:
    pagination:
      first: "&laquo; 最初"
      last: "最後 &raquo;"
      previous: "&lsaquo; 前"
      next: " &rsaquo;"
      truncate: "..."
  helpers:
    page_entries_info:
      one_page:
        display_entries:
          zero: ""
          one: "<strong>1-1</strong>/1件中"
          other: "<strong>1-%{count}</strong>/%{count}件中"
      more_pages:
        display_entries: "<strong>%{first}-%{last}</strong>/%{total}件中"

##設定ファイルを作成

rails g kaminari:config
config/initializer/kaminari_config.rb
Kaminari.configure do |config|
  config.default_per_page = 10
  # config.max_per_page = nil
  # config.window = 4
  # config.outer_window = 0
  # config.left = 0
  # config.right = 0
  # config.page_method_name = :page
  # config.param_name = :page
  # config.params_on_first_page = false
end

config.default_per_page = 10を設定することで、Controller内の.per(10)を省略できるようになります。(サーバーを再起動しないと反映されなかったので注意)

config/initializeconfig/locales以下のファイルを変更した時は、再起動が必要みたいです。

Controller
def hoge
  @users = User.page(params[:page])
end

その他のオプションに関してはこちらの記事を参照。

##表示する項目を変更

rails g kaminari:views default

app/views/kaminari以下に7つのファイルが生成されます。
主となるファイルは_paginator.html.erbで、主にこのファイルを編集することになります。不要な項目を削除しましょう。

##API

@item.total_count #=> レコード総数
@item.offset_value #=> オフセット
@item.num_pages #=> 総ページ数
@item.per_page #=> 1ページごとのレコード数
@item.current_page #=> 現在のページ
@item.first_page? #=> 最初のページならtrue
@item.last_page? #=> 最後のページならtrue

##◯位とかを表示したい
.each.with_index.offset_valueを組み合わせて実装。

View
<% @items.each.with_index(@items.offset_value + 1) do |value, index| %>
  <span><%= index %></span>
  <p><%= value.name %></p>
<% end %>

##参考
【Rails】kaminariの使い方を徹底解説!
kaminariの日本語対応
kaminari徹底入門

8
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?