spree taxons_tree 中的手风琴侧边栏答案

【问题标题】：Accordion sidebar in spree taxons_treespree taxons_tree 中的手风琴侧边栏
【发布时间】：2016-08-23 12:46:10
【问题描述】：

我正在分类法中创建一个手风琴侧边栏菜单。一切都很好，除了一件事：当我点击它的第一个父元素时，它会工作，并且 taxons_tree 是隐藏的。但是当我点击第二个、第三个等时，只有第一个 taxons_tree 是隐藏的。这是我的 _taxonomies.html.erb 代码：

<% max_level = Spree::Config[:max_level_in_taxons_menu] || 1 %>

<nav id="taxonomies" class="sidebar-item" data-hook>
  <% @taxonomies.each do |taxonomy| %>
    <% cache [I18n.locale, taxonomy, max_level, @taxon] do %>
    <div class="panel-group" id="accordion">
                <div class="panel panel-default">
                    <div class="panel-heading">
      <h4 class='taxonomy-root'><a data-toggle="collapse" data-parent="#accordion" href="#root_taxon"><span id="main_icon" class="glyphicon glyphicon-align-justify">
                            </span><%= Spree.t(:shop_by_taxonomy, taxonomy: taxonomy.name) %></a></h4></div></div></div>
      <%= taxons_tree(taxonomy.root, @taxon, max_level) %>
    <% end %>
  <% end %>
</nav>

还有我的 frontend_helper.rb 的 taxons_tree 方法：

def taxons_tree(root_taxon, current_taxon, max_level = 1)
  return '' if max_level < 1 || root_taxon.leaf?
  content_tag :div, id:'root_taxon', class: 'list-group panel-collapse collapse in' do
    taxons = root_taxon.children.map do |taxon|
      link_to(seo_url(taxon), class: 'list-group-item'){content_tag(:span, " ", class: "glyphicon glyphicon-chevron-right") + taxon.name} + taxons_tree(taxon, current_taxon, max_level - 1)
    end
    safe_join(taxons, "\n")
  end

end

我了解 _taxonomies.html.erb 中的 href 必须与我的 content_tag id 相同。你可以看到我也尝试过使用变量，但它只对第一个起作用。每个新的分类单元都必须改变它，但我不知道它是如何正确的。我从这里获取的 acodrdion 菜单的源代码：http://bootsnipp.com/snippets/featured/accordion-menu 也许它会对你有所帮助。这里的实现非常简单，只需更改#collapseOne、#collapseTwo 等。

【问题讨论】：

标签： html ruby-on-rails twitter-bootstrap sidebar taxonomy

【解决方案1】：

这里是解决方案。

taxomies.erb：

  <% max_level = Spree::Config[:max_level_in_taxons_menu] || 1 %>

  <nav id="taxonomies" class="sidebar-item" data-hook>
    <% @taxonomies.each do |taxonomy| %>
     <% cache [I18n.locale, taxonomy, max_level, @taxon] do %>
     <div class="panel-group" id="accordion">
                <div class="panel panel-default heading" >
                        <div class="panel-heading">
      <h4 class='taxonomy-root'><a data-toggle="collapse" data-parent="#accordion" href="<%= '#' + taxonomy.root.id.to_s %>"><span id="main_icon" class="glyphicon glyphicon-align-justify">
                                </span><%= Spree.t(:shop_by_taxonomy, taxonomy: taxonomy.name) %></a></h4></div></div></div>
          <%= taxons_tree(taxonomy.root, @taxon, max_level) %>
        <% end %>
      <% end %>
    </nav>

和frontend_helper.rb：

 def taxons_tree(root_taxon, current_taxon, max_level = 1)
       return '' if max_level < 1 || root_taxon.leaf?
          content_tag :div, id:root_taxon.root.id, class: 'list-group panel-collapse collapse in' do
            taxons = root_taxon.children.map do |taxon|
              link_to(seo_url(taxon), class: 'list-group-item'){content_tag(:span, " ", class: "glyphicon glyphicon-chevron-right") + taxon.name} + taxons_tree(taxon, current_taxon, max_level - 1)
            end
            safe_join(taxons, "\n")
          end

        end

【讨论】：