【Rails】ランキング形式で投稿を表示する。(部分的にパーシャルの内容を変更)

はじめに

投稿をランキング形式で表示する際に、テンプレートは流用しつつ、第1位、第2位、、、のような数字部分を変えていく動作を加える。

前提

下記は作成済み
ユーザーテーブル
マイクロポストテーブル

No	項目	内容
1	OS	Mac
2	Ruby	2.6.3
3	rails	6.0.4

基本

ただ投稿内容を繰り返し表示していくには、下記のコードでOK。

app/views/microposts/index.html.erb

<%= render @microposts %>
# => <%= @microposts.each do |micropost|%>
#    　　　　第○位
#      <%= render partial: 'microposts/micropost', locals: { micropost: micropost } %>
#    <% end %>

デフォルトでmicropostというファイル名のパーシャルを参照し、@micropostsに格納された要素を一つずつ"micropost"という変数に渡していく。それにより、該当のパーシャル内で要素一つ一つを扱うなり表示することが可能になる。
ただ今回の目的は、これにランキングをつけるために、"第○位"という文字列を加えたい。
render で展開するのではなく、eachを使って扱いやすい形にしていく。

app/views/microposts/index.html.erb

<%= @microposts.each do |micropost|%>
　　　　第○位
  <%= render partial: 'microposts/micropost', locals: { micropost: micropost } %>
<% end %>

render partial: "呼び出すファイル名", locals:{ local変数(呼び出すファイル内で用いる変数名): 渡す値 }
参考元：URL

ランキング形式で繰り返す

each_with_indexメソッドにより、each文同様に繰り返し、その繰り返し試行ごとに数字(i)が+1していく。

app/views/microposts/index.html.erb

# 第○位　+　<% render @microposts %>を実現したコード
<%= @microposts.each_with_index do |micropost, i|%>
  第<%= i %>位
　　　　# => 第0位、、、
  <%= render partial: 'microposts/micropost', locals: { micropost: micropost } %>
<% end %>

each_with_indexのデフォルトのiの初期値は0のため、初期値を(1)に設定して、第1位、第2位、、、と表示されるようにする。

ここで注意が必要なのは、上記のコードにそのまま引数を持たせて、each_with_index(引数)としても、うまく動いてくれないこと。
each.（ドット）with_index(引数)としなければ引数を受け付けてくれない。
よって、下記のように書き換える必要がある。

app/views/microposts/index.html.erb

# each_with_indexをeach.with_index(引数)に書き換える
<%= @microposts.each.with_index(1) do |micropost, i|%>
  第<%= i %>位
　　　　# => 第1位、、、
  <%= render partial: 'microposts/micropost', locals: { micropost: micropost } %>
<% end %>

これで、
第1位
〜〜〜
第2位
〜〜〜
のように表示される。

おわりに

下記のメソッドについてまとめる。
・each_with_index: each文同様に繰り返し、数字をカウントアップしていく。最初は0からスタート。
・each.with_index(引数): each文同様に繰り返し、数字をカウントアップしていく。最初は引数の数字からスタート。