概要
ページング処理の実装をサポートしてくれる Gem です。
Slim での使用例をメモしています。
導入
Gemfile
gem 'kaminari'
bundle install
users_controller.rb
def index
@users = User.page(7).per(50)
end
index.html.slim
= paginate @users
同一ページで複数のページネーション
param_name を指定して、個別にページ数を扱うようにします。
users_controller.rb
def index
@a_users = User.where(status: 'a').page(params[:a_page])
@b_users = User.where(status: 'b').page(params[:b_page])
end
index.html.slim
= paginate @a_users, param_name: 'a_page'
= paginate @b_users, param_name: 'b_page'
Ajax で更新
remote: true を指定すると Ajax が可能です。
Ajax のリクエストに対して、リストを再描画するような js を返却します。
users_controller.rb
def index
@users = User.page(param[:page])
respond_to do |format|
format.html
format.js
end
end
index.html.slim
# users
= render partial: 'users', locals: {users: @users}
index.js.slim
| $('#users').html('#{j render partial: 'users', locals: {users : @users}}');
_users.html.slim
- users.each do |user|
/ do something ...
= paginate users, remote: true
外部 API 連携
paginate_array を利用し、配列に対してページネーションを行います。
controller.rb
def index
page = params[:page] || '1'
limit = 10
offset = (page.to_i - 1) * limit
# limit, offset を受け取り、リストと最大件数を返すような API にリクエスト
@items, pagination = request_external_api(limit, offset)
total = pagination['total']
@items = Kaminari.paginate_array(@items, total_count: total).page(page).per(limit)
end
index.html.slim
= paginate @items
Bootstrap 用の View に調整
Bootstrap のテーマを指定して、 View を生成します。
rails g kaminari:views bootstrap3 -e slim
以下のファイルが生成されます。
大枠の調整に関しては _paginator.html.slim を触る形になりそうです。
app/views/
└── kaminari
├── _first_page.html.slim
├── _gap.html.slim
├── _last_page.html.slim
├── _next_page.html.slim
├── _page.html.slim
├── _paginator.html.slim
└── _prev_page.html.slim
設定調整
設定ファイルを生成します。
rails g kaminari:config
以下のファイルが生成されます。
それぞれデフォルト値がコメントされていますので、適宜調整していきます。
config/initializers/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
paginate で個別に指定することも可能です。
index.html.slim
= paginate @users, window: 2