Laravel Bootstrap 手风琴不能正常工作？

Question

在我的手风琴中，我正在展示父项。我通过使用getItems() 方法得到的。它被链接到每个项目。每个父项都有一些子项。我正在使用($item->children as $child) 并且当单击任何父项时，该父项的子项应该从下拉列表中可见。

问题是每当我单击任何父项时，每个子项都会显示在下拉列表中。但我只想显示父项的子项。如果有人可以帮助我，那就太好了。提前致谢。

这是我的刀片文件代码。

<div class="container my-4">
        <div class="accordion md-accordion" id="accordionEx" role="tablist" aria-multiselectable="true">
          <div class="card">
            <div class="card-header" role="tab" id="headingTwo2">
              @foreach(getItems() as $item)
                <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseTwo2"
                  aria-expanded="false" aria-controls="collapseTwo2">
                  <h5 class="mb-0">
                    {{ $item->name }} <i class="fas fa-angle-down rotate-icon"></i>
                  </h5>
                </a>
                <div id="collapseTwo2" class="collapse" role="tabpanel" aria-labelledby="headingTwo2"
                  data-parent="#accordionEx">
                  <div class="card-body">
                     @foreach ($item->children as $child)
                      <a href="{{ route('category.island.list') }}?category={{ $child->id }}"
                      class="dropdown-item" data-id="{{ $child->id }}" data-name="{{ $child->name }}">
                      <span>{{ $child->name }}</span>
                      </a>
                @endforeach
                  </div>
                </div>
              @endforeach
            </div>

          </div>
          
        </div>
      </div>

Answer 1

这是正常的，因为它们在这里都有相同的href：

<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseTwo2"
                  aria-expanded="false" aria-controls="collapseTwo2">

并且他们都在这个 div 中引用了相同的“id”：

<div id="collapseTwo2" class="collapse" role="tabpanel" aria-labelledby="headingTwo2"
                 data-parent="#accordionEx">

所以只需在你的 foreach 中添加一个变量作为“计数”，这将增加 foreach 循环，你只需将它添加到你的 href 和 Id 中，这很好:)

树枝方式： 在第一个 foreach 中：TWIG：{% set count = 0 %} PHP：<?php $count = 0; ?> 在最后的第一个 foreach 中： TWIG ：{% set count = count + 1 %} PHP ：<?php $a++; ?> 如下：

    <div class="container my-4">
            <div class="accordion md-accordion" id="accordionEx" role="tablist" aria-multiselectable="true">
              <div class="card">
                <div class="card-header" role="tab" id="headingTwo2">
<?php $count = 0; ?>
                  @foreach(getItems() as $item)
                    <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseTwo2{{ $count }}"
                      aria-expanded="false" aria-controls="collapseTwo2{{ $count }}">
                      <h5 class="mb-0">
                        {{ $item->name }} <i class="fas fa-angle-down rotate-icon"></i>
                      </h5>
                    </a>
                    <div id="collapseTwo2{{ $count }}" class="collapse" role="tabpanel" aria-labelledby="headingTwo2"
                      data-parent="#accordionEx">
                      <div class="card-body">
                         @foreach ($item->children as $child)
                          <a href="{{ route('category.island.list') }}?category={{ $child->id }}"
                          class="dropdown-item" data-id="{{ $child->id }}" data-name="{{ $child->name }}">
                          <span>{{ $child->name }}</span>
                          </a>
                    @endforeach
                      </div>
                    </div>
<?php $count++; ?> 
                  @endforeach
                </div>
    
              </div>
              
            </div>
          </div>