7.リファクタリング
リファクタリングとはいままで闇雲に作ってきたコードを綺麗に整理整頓して無駄を省くこと。
それじゃあやってみよう。
7.1.パーシャルコレクションを描画する
リファクタリングする対象はshow.html.erbです。
コメント機能もつけたしすごくごちゃごちゃしてきたからね。
show.html.erb
<p>
<strong>Title:</strong>
<%= @article.title %>
</p>
<p>
<strong>Text:</strong>
<%= @article.text %>
</p>
<h2>Comments</h2>
<% @article.comments.each do |comment| %>
<p>
<strong>Commenter:</strong>
<%= comment.commenter %>
</p>
<p>
<strong>Comment:</strong>
<%= comment.body %>
</p>
<% end %>
<h2>Add a comment:</h2>
<%= form_with(model: [ @article, @article.comments.build ], local: true) do |form| %>
<p>
<%= form.label :commenter %><br>
<%= form.text_field :commenter %>
</p>
<p>
<%= form.label :body %><br>
<%= form.text_area :body %>
</p>
<p>
<%= form.submit %>
</p>
<% end %>
<%= link_to 'Edit Article', edit_article_path(@article) %> |
<%= link_to 'Back to Articles', articles_path %>
パーシャルって前にも出てきた。
_form.html.erbっていう部分テンプレートをつくって、new.html.erbを簡略化したね。
おなじように
_comment.html.erbをつくってshow.thml.erbを簡略化しよう。
_comment.html.erb
<p>
<strong>Commenter:</strong>
<%= comment.commenter %>
</p>
<p>
<strong>Comment:</strong>
<%= comment.body %>
</p>
コメントの表示のところを抜き出しました。
次にshow.html.erbを編集しよう。
show.html.erb
<p>
<strong>Title:</strong>
<%= @article.title %>
</p>
<p>
<strong>Text:</strong>
<%= @article.text %>
</p>
<h2>Comments</h2>
<%= render @article.comments %>
<h2>Add a comment:</h2>
<%= form_with(model: [ @article, @article.comments.build ], local: true) do |form| %>
<p>
<%= form.label :commenter %><br>
<%= form.text_field :commenter %>
</p>
<p>
<%= form.label :body %><br>
<%= form.text_area :body %>
</p>
<p>
<%= form.submit %>
</p>
<% end %>
<%= link_to 'Edit Article', edit_article_path(@article) %> |
<%= link_to 'Back to Articles', articles_path %>
<h2>Comments</h2>
<%= render @article.comments %>
ここの部分がパーシャルを呼び出しているところだね。
7.2.パーシャルのフォームを描画する
こんどはコメントを作成するフォームのとこもパーシャルにおいだそう。
_form.html.erb
<%= form_with(model: [ @article, @article.comments.build ], local: true) do |form| %>
<p>
<%= form.label :commenter %><br>
<%= form.text_field :commenter %>
</p>
<p>
<%= form.label :body %><br>
<%= form.text_area :body %>
</p>
<p>
<%= form.submit %>
</p>
<% end %>
パーシャルはこんなかんじ。ただのコピペだね。
show.html.erb
<p>
<strong>Title:</strong>
<%= @article.title %>
</p>
<p>
<strong>Text:</strong>
<%= @article.text %>
</p>
<h2>Comments</h2>
<%= render @article.comments %>
<h2>Add a comment:</h2>
<%= render "comments/form" %>
<%= link_to 'Edit Article', edit_article_path(@article) %> |
<%= link_to 'Back to Articles', articles_path %>
こんなにスッキリしました！
<h2>Add a comment:</h2>
<%= render "comments/form" %>
ここだけど、このように/つきでrenderしてあげると、Railsちゃんが階層を認識してくれて
commentsの下にある_form.html.erbを見に行ってくれるんだって。
リファクタリング完了！