kaminariの使い方 まとめ

こんにちは。しおはまです。
今回はページネーションを実装するのに便利なGem(kaminari)の基本的な使い方をまとめてみます。

ページネーションとは

よくブラウザとかで見るこれです。(下記の画像を参照)

検索結果が多くなり、1ページに収めようとするとUI的に見にくい場合なんかにページネーションは使用されていますね。
または、掲示板アプリなどでたくさん記事を投稿すると、古い記事がどんどん下のページにいってしまい、見にくくなりますよね。
そんな時、ページネーションを実装し、ページを分けることで見やすくなります。
そこで、RailsのGemで簡単にページネーションが実装できるkaminariというGemの使い方を学んだので、自分なりにアウトプットしていこうと思います。

kaminariのインストール

まず初めにGemfileにkaminariを追加し、bundle installします。

gem 'kaminari'

インストールが完了したらkaminariを使うことができます。簡単ですね。

記述の仕方

使い方はシンプルで、controllerでページネーションさせたいデータにpageメソッドを追加して、viewファイルにて、paginateメソッドを用いてページネーションを追加するだけです。
文脈だとわかりにくいのでここでは例として、ToDoアプリを作ったとして、そのToDoリストをページネーションさせたいとします。
ToDoアプリのモデルはTaskとし、ToDo一覧ページでタスクが10件以上あるとページネーションさせるとします。(あくまでも例です。アプリにてCRUD処理が実装できている前提です。)

# tasks_controller.rb

class TaskController < ApplicationController
  def index
    @tasks = Task.all
  end
end

Taskコントローラーのindexアクションではこのようなコードになっていると思います。
ここで、kaminariをインストールした時に追加されるpageメソッドを使います。
pageメソッドについては後述します。

# tasks_controller.rb

class TaskController < ApplicationController
  def index
    @tasks = Task.all.page(params[:page])    -----------この部分
  end
end

page(params[:page]) を追加し、viewファイルにてページネーションの指定をすることでページネーションが完成します。

#viewファイル

<%= paginate @tasks %>

このようにviewファイルにてページネーションを表示させたい部分にpaginateメソッドを使用し、引数に先程pageメソッドを設定したインスタンスを渡すことでページネーションが実装されます。
ちなみにデフォルトでは、ページネーションが1ページに表示するレコード数はデフォルトで25件です。

※pageメソッドについて

kaminariを導入すると、モデルクラスにpageメソッドが定義されます。このメソッドは、ページネーションにおけるページ数を指定します。ビューのリクエストの際paramsの中にpageというキーが追加されて、その値がビューで指定したページ番号となります。よって、pageの引数はparams[:page]となります。

kaminariのデフォルト設定の変更

今の状態でもページネーションは実装できていますが、このままでは1ページに表示するレコード数がで25件なので、1ページに表示するレコードを10件に変更したいです。
やり方は様々ありますが、ここではrails gコマンドでconfig/initializersに設定ファイルを作成させましょう。

$ rails g kaminari:config

これで簡単にconfig/initializersファイルにkaminari_config.rbが作成されます。
作成された kaminari_config.rbを見るとこのようなコードが書かれていると思います。

Kaminari.configure do |config|
  # config.default_per_page = 25
  # 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
end

ここでkaminariのデフォルトの設定を変更できます。 色々ありますが、1つずつ見ていきましょう。 config.default_per_page
→1ページ辺りの項目数を変更できます。
config.max_per_page
→1ページ辺りの最大数を変更できます。
config.window
→現在のページから、左右何ページ分のリンクを表示させるかを変更できます。
config.outer_window
→最初(First)と最後(Last)のページから、左右何ページ分のリンクを表示させるかを変更できます。
config.left
→最初(First)のページから、何ページ分のリンクを表示させるかを変更できます。
config.right
→最終(Last)ページから、何ページ分のリンクを表示させるかを変更できます。
config.page_method_name
→モデルに追加されるページ番号を指定するスコープの名前を変更できます。
config.param_name = :page
→ページ番号を渡すために使用するパラメータ名を変更できます。

kaminari_config.rbではこのような色々なデフォルトの設定を変更することができます。
今回は1ページに表示するレコードを10件に変更したいので、

 config.default_per_page = 10

というふうに変更することで1ページに表示するレコードを10件に変更することができます。

まとめ

ここまでページネーションを簡単に実装することができるGemkaminariについて、使い方を自分なりにまとめてみました。
ページネーションは何度も実装するものでは無いかもしれませんが、忘れてしまわないようにブログにまとめることで、整理することができました。
ここまで読んでいただき、ありがとうございました。