個人アプリ開発 写真投稿機能作成２

作業内容

修正　前回の続き

課題：新規作成ページで画像投稿フォームは複数用意することができたが、写真が1つしか保存されない

フィールドを複数作ればいいのかと思っていましたが、上手くいきませんでした。
上書きされるのか、最後の一つのみ保存される。

[_form.html.haml]
= f.fields_for :images, @group.images.build do |i|
      = i.file_field :image 
      = i.file_field :image
      = i.file_field :image
      = i.file_field :image

▶︎無理やりフィールドだけ並べたことが原因でした。
下記のように編集し、複数画像が無事保存されました。

[_form.html.haml]
= f.fields_for :images do |i|
      = i.file_field :image 

[groups_controller]
def new
    @group = Group.new
    4.times{@group.images.build}
end

newアクション内の@group.images.buildでgroupにネストしたimageを定義しておく。
4.timesとすることでビュー側で画像アップロードのフォームが4つ生成される。

記事詳細表示機能　CSS

ページにスタイルを当てて完了。
メイン画像が粗くなってしまい不安になりましたが、原因としてはケータイ画像だったせいのようです。
元サイズが表示サイズより小さかった。
参考：
HTMLで画像の画質が荒くなる原因と対処法を現役デザイナーが解説【初心者向け】 | TechAcademyマガジン