今回はフリマアプリで
①1つも商品が出品されていない場合はダミー画像が表示されること
②商品が1つでも出品されていればダミー画像は表示されていないこと
こちらの条件を実装した。
最初に記述したのは下記の通り。
<% if @items.length == 0 %>
<% @items.each do |item|%>
<li class='list'>
<%= link_to item_path(item.id) do %>
<div class='item-img-content'>
<%= image_tag item.image,class: "item-img" %>
<%# 商品が売れていればsold outを表示しましょう %>
<% if @items.present? %>
<div class='sold-out'>
<span>Sold Out!!</span>
</div>
<% end %>
<%# //商品が売れていればsold outを表示しましょう %>
</div>
<div class='item-info'>
<h3 class='item-name'>
<%= item.product_name %>
</h3>
<div class='item-price'>
<span><%= item.price %>円<br><%= item.shipping_charge.name %></span>
<div class='star-btn'>
<%= image_tag "star.png", class:"star-icon" %>
<span class='star-count'>0</span>
</div>
</div>
</div>
<% end %>
</li>
<% end %>
<%# //商品のインスタンス変数になにか入っている場合、中身のすべてを展開できるようにしましょう %>
<%# 商品がない場合は以下のダミー商品が表示されるようにしましょう %>
<% else %>
<%# 商品がある場合は表示されないようにしましょう %>
<li class='list'>
<%= link_to '#' do %>
<%= image_tag "https://tech-master.s3.amazonaws.com/uploads/curriculums/images/Rails1-4/sample.jpg", class: "item-img" %>
<div class='item-info'>
<h3 class='item-name'>
商品を出品してね!
</h3>
<div class='item-price'>
<span>99999999円<br>(税込み)</span>
<div class='star-btn'>
<%= image_tag "star.png", class:"star-icon" %>
<span class='star-count'>0</span>
</div>
</div>
</div>
<% end %>
</li>
こちらだと何も投稿していない時はダミー画像が表示されるようになったが
代わりに今まで表示されていた出品した画像が表示されなくなってしまった。
データーベースには出品した情報は保存されているのに。。。
原因を深堀してみると
```ruby
<% if @items.length == 0 %>
こちらだと空の場合なのでeach文の上に記述するとあべこべになっており表示されなくなってしまったようだ。
なので使用するメソッドを変えてみた。
<% if @items.present? %>
<% @items.each do |item|%>
<li class='list'>
<%= link_to item_path(item.id) do %>
<div class='item-img-content'>
<%= image_tag item.image,class: "item-img" %>
<%# 商品が売れていればsold outを表示しましょう %>
<% if @items.present? %>
<div class='sold-out'>
<span>Sold Out!!</span>
</div>
<% end %>
<%# //商品が売れていればsold outを表示しましょう %>
</div>
<div class='item-info'>
<h3 class='item-name'>
<%= item.product_name %>
</h3>
<div class='item-price'>
<span><%= item.price %>円<br><%= item.shipping_charge.name %></span>
<div class='star-btn'>
<%= image_tag "star.png", class:"star-icon" %>
<span class='star-count'>0</span>
</div>
</div>
</div>
<% end %>
</li>
<% end %>
<%# //商品のインスタンス変数になにか入っている場合、中身のすべてを展開できるようにしましょう %>
<%# 商品がない場合は以下のダミー商品が表示されるようにしましょう %>
<% else %>
<%# 商品がある場合は表示されないようにしましょう %>
<li class='list'>
<%= link_to '#' do %>
<%= image_tag "https://tech-master.s3.amazonaws.com/uploads/curriculums/images/Rails1-4/sample.jpg", class: "item-img" %>
<div class='item-info'>
<h3 class='item-name'>
商品を出品してね!
</h3>
<div class='item-price'>
<span>99999999円<br>(税込み)</span>
<div class='star-btn'>
<%= image_tag "star.png", class:"star-icon" %>
<span class='star-count'>0</span>
</div>
</div>
</div>
<% end %>
</li>
<% end %>
<% if @items.present? %>
このpresent?を使うことにより指定したインスタンスが存在する時になったので
無事出品した商品は表示されダミーの画像は表示されなくなった。