Question

我有一个名为包的模型，其中包含许多属性（包资源）。我想在一组选项卡式字段中显示包的内容 - 每个选定的资源都有一个。

如果项目中没有涉及资源，那么它就不会成为视图中显示的标签。

我已设置选项卡，因此只有在选择资源为true时才会显示这些选项卡。这样做如下：

<div class="dp-tab-1">
    <ul class="dp-tab-list row" id="myTab">
       <% if @project.package.has_background_ip == true %>
         <li class="col-md-2 col-xs-6 active" >
              <a href="#tab-content-first">
                 <span class="glyph-item" data-icon="&#xe043;"></span> 
              </a>
         </li>
      <% end %>

      <% if @project.package.has_data == true %>    
          <li class="col-md-2 col-xs-6">
             <a href="#tab-content-second">
                 <div class="glyph-item" data-icon="&#xe05c;"></div>
             </a>
          </li>
      <% end %>

      <% if @project.package.has_material == true %>   
          <li class="col-md-2 col-xs-6">
              <a href="#tab-content-third">
                   <div class="glyph-item" data-icon="&#xe04c;"></div>
              </a>
          </li>
      <% end %>
 </ul>

上述位的问题是在第一个选项卡内指定了活动选项卡。如果第一个选项卡不是必需的资源，则可以包含接下来的两个选项卡（如果需要），但是第一个选项卡为true将不具有true。

如何动态分配＆＃39;活动标签＆＃39;状态为第一个真实条件，以便显示活动选项卡的选项卡内容。

  <div class="dp-tab-content tab-content">
                                        <div class="tab-pane row fade in active" id="tab-content-first">
                                            <% if @project.package.has_background_ip == true %>
                                                <div class="col-md-6 text-center">
                                                    <%= image_tag(@project.package.background_ip.bip_image, :class=>"wow fadeInLeft img-responsive", :alt=>"123") %>

                                                </div>

Answer 1

首先，您不必使用== true显式比较true。直奔。

<% if @project.package.has_background_ip %>

其次，为什么不在helper中实现一个非常简单的检查来定义哪个选项卡应该是活动的，然后使用该索引。助手：

# will return 1 if has_background_ip is true
# if not, will return 2 if has_data is true
# if both are false, will return 3 if has_material is true
# return -1 if all are false
def firstActiveTab 
  return case
  when @project.package.has_background_ip
     1
  when @project.package.has_data
     2
  when @project.package.has_material
     3
  else
     -1
  end
end

然后在视图（erb）中，如果firstActiveTab方法返回1（这意味着has_background_ip为true），代码将仅为第一个选项卡添加活动类。

<li class="col-md-2 col-xs-6 <%= 'active' if firstActiveTab == 1 %>" >
  ... first tab content for background_ip...
</li>
<li class="col-md-2 col-xs-6 <%= 'active' if firstActiveTab == 2 %>" >
  ... second tab content for has_data...
</li>

使用== 1表示第一个标签代码，= = 2表示第二个标签代码

Rails 4 - 如何将活动制表符指定为真实条件的第一个实例

1 个答案: