現状と実現したいこと
現在railsでツイッタークローンアプリを作成しています。
もともとrefileのgemを使って画像投稿機能を実装していたのですが、railsのバージョンが5.2.6でありactivestorageが推奨されていること、デプロイをした本番環境では正常に画像投稿ができなかった(refileが長年アップデートされていないのが原因?)こともありactivestorageでの開発を進めています。
refileでは投稿された画像をクリックしたときに拡大表示がされるような記述ができていました。
modalで画像を識別する際には、idに<%= post.image_id %>というものを持たせていました。
これはrefileの場合カラムを別に追加しなくてはいけないので使えていましたが、activestorageではカラムが不必要ということもあり、任意の画像をどうとって来れば良いのかわからない状況です。
また、問題である部分が今述べたところなのかもまだ判定できていません。
挙動はこちらです↓
https://i.gyazo.com/0210777bec3f4f6962bffb8108fd960c.mp4
下記に該当のコード等載せさせていただきます。
<!-- Modal -->の1行目でid="postimage<%= post.image_id %>"としていますが、現状ではactivestorageで画像を投稿しているのでimage_id=nilとなっており取得することができない状況です。html
1 <div data-toggle="modal" data-target="#postimage<%= post.image_id %>"> 2 <% post.images.each do |image| %> 3 <%= image_tag post.images[0], size:"80x80" if post.images.attached? %> //ここで投稿した画像(拡大前)を表示 4 <% end %> 5 </div> 6 7 <!-- Modal --> 8 <div class="modal fade" id="postimage<%= post.image_id %>" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 9 <div class="modal-dialog" role="document"> 10 <div class="modal-content"> 11 <div class="modal-header" style="height: 10px;"> 12 <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 13 <span aria-hidden="true">×</span> 14 </button> 15 </div> 16 <div class="modal-body"> 17 <%= image_tag post.images[0], size:"450x450" if post.images.attached?%> //拡大後 18 </div> 19 </div> 20 </div> 21 </div>
ひとつわからない点が、下記の部分で|image|としているのでimage_tagでimages=>imageとするべきだと思うのですが、そうするとNoMethodエラー(Did you mean? images)が出ます。
Html
1<% post.images.each do |image| %> 2 <%= image_tag post.images[0], size:"80x80" if post.images.attached? %> 3<% end %>
どなたかお力添えお願いいたします。
あなたの回答
tips
プレビュー