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

问题描述

在手风琴中,我正在显示父项。我通过使用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>

解决方法

这是正常的,因为它们在这里都具有相同的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循环,您只需使用twig将其添加到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>