【Rails】画面下の番号をクリックすると次のページにいくやつ【ページネーション】

備忘録:
こういうやつ↓これを一覧表示するページの下に表示させる

f:id:michimo_10:20210414181641p:plain
pagenate


gemを入れる

今回使うのはRailsのkaminariというgem。

github.com

そして、やり方

qiita.com

基本的に上のようにやっていけば良し
Gemfile内にgem 'kaminari'を記述してから
ターミナルで$ bundle installする

コントローラーに直接ページ数を書かないようにするべく別ファイルを用意する。
$ rails g kaminari:config
↑をターミナルで実行し、

生成されたファイルの中から必要な部分のコメントを外したり数字を変更する

kaminariのファイル

config/initializers/kaminari_config.rb

# frozen_string_literal: true

Kaminari.configure do |config|
  config.default_per_page = 20  
  # ↑のコメントアウトを外し、数を変更し1ページに何項目表示するか設定する、それ以外は自由に変更する
  # config.max_per_page = nil
  # config.window = 4
  # config.outer_window = 0    #  ←【1】
  config.left = 2  #  ← 【2】
  config.right = 2 #  ←  【3】
  # config.page_method_name = :page
  # config.param_name = :page
  # config.max_pages = nil
  # config.params_on_first_page = false
end

【1】

f:id:michimo_10:20210414225811p:plain
pagenate
両端の2つ前である[1][2]と次の[60][61]の番号表示される

【2】
左側に2つ番号を表示させる[1][2]の部分
【3】
右側に2つ番号を表示させる[60][61]の部分

コントローラー部分

一覧表示する部分(index,bookmarks)のアクションにkaminariのメソッドのpage(params[:page])を付け足してあげる
boards_controller

class BoardsController < ApplicationController
  before_action :set_params, only: %i[edit update destroy]
  def index
    @boards = Board.all.includes(%i[user bookmarks]).order(created_at: :desc).page(params[:page])
  end

#省略

  def bookmarks
    # bookmarksメソッドの定義
    @bookmark_boards = current_user.bookmark_boards.includes(:user).order(created_at: :desc).page(params[:page])
    # @bookmarksに(=) ログインしているユーザーの,掲示板たちが,userモデルに含まれていたら,作成日が新しい順に並べる.ページ下にべネーションを使い表示を小分けにする



ビュー部分


views/boards/index.html.erb

   <!-- 掲示板一覧 -->
  <div class="row">
    <div class="col-12">
      <div class="row">
        <% if @boards.present? %>
          <%= render @boards %>
        <% else %>
          <p><%= t('.fail') %></p>
        <% end %>
      </div>
      <%= paginate @boards %> # この部分を追加,コントローラーのindexに記した@boardsによってデータを一覧が表示される
    </div>
  </div>
</div>

views/boards/bookmarks.html.erb

   <!-- お気に入り掲示板一覧 -->
  <div class="row">
    <div class="col-12">
      <div class="row">
        <% if @bookmark_boards.present? %> # もし,お気に入りの掲示板が無かったら
          <%= render @bookmark_boards %>
          #renderの闇 partialは_board.html.erbを呼び出し, collection:で@bookmarks_boards(お気に入りの掲示板)を繰り返し表示する要素 
          # partial: と collection: で1セット! じゃないとエラーになる 
        <% else %>
          <p><%= t('bookmarks.fail') %></p>
 # locales/activerecord/ja.yml内に記載したboard内の翻訳で.failの部分の'掲示板がありません'を表示
        <% end %>
      </div>
    </div>
    <%= paginate @bookmark_boards %>
    #  ↑ この部分を追加
  </div>
</div>