Question

我正在使用基础5框架的Rails 4。假设我有以下索引操作：

class CompaniesController < ApplicationController
  def index
    @companies = Company.all
  end
end

我想在可变宽度容器中显示索引，如下所示：

<div class="first row">
  <div class="small-4 columns">
    <%= @companies[0] %>
  </div>
  <div class="small-8 columns">
    <%= @companies[1] %>
  </div>
</div

<div class="second row">
  <div class="small-8 columns">
    <%= @companies[2] %>
  </div>
  <div class="small-4 columns">
   <%= @companies[3] %>
  </div>
</div

<div class="third row">
  <div class="small-4 columns">
    <%= @companies[4] %>
  </div>
  <div class="small-4 columns">
   <%= @companies[5] %>
  </div>
  <div class="small-4 columns">
   <%= @companies[6] %>
  </div>
</div>

<%= Pagination %>

等等。

你怎么干这个并动态确定布局的宽度？

Answer 1

好的，有些事情需要考虑：

<强>对象

首先需要考虑的是Rails是使用对象（而不是数组）构建的。您对@companies[x]的调用类似于调用数组。虽然情况严格如此，但阵列中的每个成员都是对象，需要被视为

这样做的方法是以正确的方式遍历对象：

@companies.each do |company|
   @company.name
end

我猜你在你的问题中使用数组作为参考，但我想我明确了Rails 应该如何使用对象

<强>模式

是一个模式，你要问的是什么。通过评论和您对Medium.com的引用，我做了类似的事情：

#app/views/your_view.html.erb
possibilities = [[4,8], [4,4,4], [8,4]]
@companies.each_slice(3) do |companies| 
   content_tag :div, class: "row" do
      format = possibilities.sample
      companies.each_with_index do |company, i|
         content_tag :div, class: "small-#{format[i]} columns" do
            = company.name
         end
      end
   end
end

这应该创造你正在寻找的东西！虽然需要进一步测试，但

Rails变量布局

1 个答案: