在浏览类别时循环显示不需要的div

Question

我在views/pages/index.html.erb

中使用此循环

<div class="container-fluid">
  <div class="row">
    <% @products.each do |category, products| %>
      <% products.each_with_index do |product, index| %>
        <div class="col-lg-4 col-sm-6 col-xs-12 center-block">
          <% if index == 0 %>
            <%= image_tag product.image.url(:medium), class: "img-responsive" %>
            <div class="caption">
              <p><%= product.category.name %></p>
            </div> 
          <% end %>
        </div> 
      <% end %>
    <% end %>
  </div>
</div>

它工作正常并做了它应该做的事情，它循环遍历每个类别并呈现添加到每个类别的最后一张图片。

但问题是当我添加产品并将它们分配到views/products/new.html.erb中的类别时，上面的循环似乎在行中添加了额外的空div's。我不明白为什么会这样做......任何人都可以给我一个提示，为什么会发生这种情况？

这是它在google开发工具中的显示方式

正如您所看到的那样，行中有四个空的不需要的div。

Answer 1

我无法保证，但我认为if条件会产生问题。

首先检查删除<% if index == 0 %>条件，如果工作正常，请对其进行必要的更改。