Laravel - 为嵌套集中的每个 parent 创建 bootstrap 下拉列表

Laravel - Creating bootstrap dropdown for each parent in a nested set

我正在使用 etrepat/baum 为我在 laravel 项目中的应用程序创建类别。当我想为类别创建 bootstrap 下拉菜单时,在 blade 中使用 @foreach 时遇到问题。当结构如下时,这很好用:

<nav id="nav2" role="navigation">
  <ul class="nav navbar-nav">
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Shop by Category<span class="caret"></span></a>
      <ul class="dropdown-menu" role="menu">
        @foreach($catnav as $cat) @if($cat->depth == 0)
        <li>
          {{ HTML::link(URL::action('StoreController@getCategories', [$cat->slug]), $cat->name) }} @else($cat->depth == 1)
          <ul>
            <li><a href="{{ URL::to('/store/categories/' . implode('/', $cat->getAncestorsAndSelf()->lists('slug'))) }}">{{$cat->name}}</a>
            </li>
          </ul>
        </li>
        @endif @endforeach
      </ul>
    </li>
  </ul>
</nav>

这是上面的输出:

但我不想有一个 按类别购物 下拉菜单,但我正在尝试为每个 parent 创建一个 dropdowndropdown-menu 中包含 children 的类别。我试过这个结构,但是 @foreach 会弄乱布局。

<nav id="nav2" role="navigation">
  <ul class="nav navbar-nav">
    @foreach($catnav as $cat) @if($cat->depth == 0)
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">{{ HTML::link(URL::action('StoreController@getCategories', [$cat->slug]), $cat->name, array('class'=>'dropdown-toggle' ,'data-toggle'=>'dropdown')) }}<span class="caret"></span></a>
      @else($cat->depth == 1)
      <ul class="dropdown-menu" role="menu">
        <li><a href="{{ URL::to('/store/categories/' . implode('/', $cat->getAncestorsAndSelf()->lists('slug'))) }}">{{$cat->name}}</a>
        </li>
        @endif
      </ul>
    </li>
    @endforeach
  </ul>
</nav>

我怎样才能做到这一点?

经过漫长的一天试图解决这个问题,我得出了结论:

  • 使用toHierarchy()方法return查询树的嵌套集合。

  • 使用 @foreach 循环获取所有父节点并在另一个 @foreach 中获取子节点。

  • 使用 isRoot() 函数检查该项目是否为父项目。

  • 使用isLeaf()函数检查分支是否结束。

  • 使用大量 @if 语句。

解决方案:

<nav id="nav2" role="navigation">
    <ul class="nav navbar-nav">
    @foreach($catnav as $item)
        <li @if($item->isRoot())class ="dropdown"@endif>
            @if(!$item->isLeaf())
                <a @if($item->isRoot()) class="dropdown-toggle"@endif href="/store/categories/{{ $item->slug }}">
                {{ $item->name }}
                @if($item->isRoot()) <span class="caret"></span> @endif
                </a>
            @else
                <a href="/store/categories/{{ $item->slug }}">{{$item->name}}</a>
            @endif
            @if($item->isRoot() && !$item->isLeaf())
            <ul class="dropdown-menu">
                @foreach($item->children as $child)
                  <li><a href="{{ URL::to('/store/categories/'.implode('/', $child->getAncestorsAndSelf()->lists('slug'))) }}">{{$child->name}}</a></li>
                @endforeach
            </ul>
            @endif
        </li>
    @endforeach
    </ul>
</nav>

这是一个 package I created to easily create Dropdown Menu 并且只关注开发。

您只需使用以下代码即可创建下拉菜单:

  • Blade:

    {!! Dropmenu::display('MenuName') !!}
    
  • 控制器:

    $menu = Dropmenu::display('MenuName');
    return view('name.view', ['menu' => $menu]);