ruby-on-rails - 三列有序列表

Question

我有一个类别列表，我想在按名称排序的 3 列中显示。我正在使用ul和li使用 css

li {
  float: left;
  width: 33%;
}

所以我可以遍历每个类别。这工作正常，除了一个问题，订购。我想要按字母顺序但按列排序的列表。为了演示，如果我有 7 个类别，A 到 G，它目前看起来像

A  |  B  |  C
D  |  E  |  F
G  |

我希望它看起来像

A  |  D  |  G  
B  |  E  |
C  |  F  |

有没有办法做到这一点？

Answer 1

有两种方法可以解决这个问题。两者都涉及将您的列表分为 3 个组，可以使用这些组来实现，in_groups_of但您需要传递应该属于该组的元素数量

@categories = ('A'..'G').to_a

total_per_column = (@categories.size / 3.0).ceil
@categories = @categories.in_groups_of(3, false)

您需要通过false，这样它就不会尝试填充缺失的元素，即最后一组将仅包含“G”

接下来是两个选项：

1. 使用ul向左浮动的3

   <% @categories.each do |categories| %>
     <ul>
      <% categories.each do |category| %>
        <li><%= category %></li>
      <% end %>
     </ul>
   <% end %>
   

2. 或使用如下的某种逻辑

   <ul>
     <% total_per_column.times do |index| %>
       <% @categories.each do |categories| %>
         <% if category = categories[index] %>
           <li><%= category %></li>
         <% end %>
       <% end %>
     <% end %>
   </ul>
   

我个人更喜欢第一个，因为它更简单。:)

Answer 2

xs = %w(a b c d e f g)
xs.in_groups(3).transpose
#=> [["a", "d", "g"], ["b", "e", nil], ["c", "f", nil]]

现在行元素放置得很好，绘制表格。

Answer 3

@array = [A..Z]  
$i = 0
$j = 0 
    while $i < $array.count  do
     <ul>
       while $j < 3
      <li>
        puts @array[$i]
      </li>
        $j +=1
       end
       $i +=1
     </ul>
    end

使用嵌套 while 循环的概念。