Laravel 背包下拉菜单问题答案

【问题标题】：Laravel backpack dropdown menu issueLaravel 背包下拉菜单问题
【发布时间】：2018-04-03 00:12:01
【问题描述】：

我创建了一个带有一些链接的下拉菜单。它在台式机上正常工作，但在移动设备上却有一个奇怪的问题。当我展开菜单时，它不会按下它下面的其他菜单。但是，如果我重新加载页面一次！换句话说，当我打开一个页面时，它不会向下推，当我刷新它时。如果我再次尝试刷新它，那么问题又回来了，依此类推。检查照片以了解确切的问题：

Issue is shown

No issue

这是相关的（据我所知）代码：

<!-- This file is used to store sidebar items, starting with Backpack\Base 0.9.0 -->
<li><a href="{{ backpack_url('dashboard') }}"><i class="fa fa-dashboard"></i><span>{{ trans('backpack::base.dashboard') }}</span></a></li>
@if (Auth::user()->admin) 
<!-- @if(isset($company) && !Auth::user()->admin)
<li class="treeview active menu-open">
@else -->
<li class="treeview">
<!-- @endif -->
    <a href="#">
    <i class="fa fa-building"></i>
    <span>Välj ett företag</span>
    <span class="pull-right-container">
        <i class="fa fa-angle-left pull-right"></i>
    </span>
    </a>   
        <ul class="treeview-menu">    
        @foreach($allCompanies as $singleCompany)
  <!--       @if(isset($company) && $singleCompany->id == $company->id)
            <li class="active">
        @else -->
            <li>
       <!--  @endif -->
                <a href="/company/{{ $singleCompany->id }}">{{ $singleCompany->name }}</a>
            </li>
        @endforeach
        </ul>    
</li>
@endif
<!-- @if (Request::is('cp/*'))
<li class="treeview active">
@else -->
<li class="treeview">
<!-- @endif -->
    <a href="#">
    <i class="fa fa-building"></i>
    <span>Kontrollpanelen</span>
    <span class="pull-right-container">
        <i class="fa fa-angle-left pull-right"></i>
    </span>
    </a>
    <ul class="treeview-menu">
        @if (Auth::user()->admin) 
         <!--    @if (Request::is('cp/addcompanyview'))           
            <li class="active">
            @else -->
            <li>
            <!-- @endif  -->               
            <a class="btn btn-primary btn-block" href="/cp/addcompanyview" role="button">
                Lägg till företag
                </a>
            </li>
     <!--        @if (Request::is('cp/adduserview'))           
            <li class="active">
            @else -->
            <li>
           <!--  @endif  --> 
            <a class="btn btn-primary btn-block" href="/cp/adduserview" role="button">
                Lägg till handläggare
            </a></li>
        <!--     @if (Request::is('cp/user/*') || Request::is('cp/user'))           
            <li class="active">
            @else -->
            <li>
           <!--  @endif  --> 
            <a class="btn btn-primary btn-block" href="/cp/user" role="button">
                Hantera handläggare
            </a></li>
    <!--         @if (Request::is('cp/managecompaniesview'))           
            <li class="active">
            @else -->
            <li>
            <!-- @endif   -->
            <a class="btn btn-primary btn-block" href="/cp/managecompaniesview" role="button">
                Hantera företag
            </a></li>        
        <!-- @endif -->
  <!--       @if (Request::is('cp/manageclientsview'))           
        <li class="active">
        @else  -->
        <li>
     <!--    @endif  --> 
        <a class="btn btn-primary btn-block" href="/cp/manageclientsview" role="button">
              Hantera kunder
        </a></li>   
    </ul>
</li>
@if (Auth::user()->admin)    
<li><a href="{{ url(config('backpack.base.route_prefix', '').'/backup') }}"><i class="fa fa-hdd-o"></i> <span>Backups</span></a></li>
@endif

【问题讨论】：

我在使用 Laravel Backpack 以及构建它的原始 AdminLTE 主题时都没有遇到过这个问题。您是否比较了您的代码与原始主题的差异？
我正在使用一个非常简单的 sn-p 来显示菜单。即使我使用与示例代码中完全相同的菜单，问题仍然存在。非常混乱。
问题很可能与 JavaScript 和/或 CSS 相关，因此我认为您发布的代码不足以确定原因。你可以发布一个sn-p来重现这个问题吗？任何控制台错误？
是的，这是 AdminLTE 中不存在的附加背包。请参阅下面的答案。

标签： laravel adminlte

【解决方案1】：

这个问题确实是 JS 相关的，它是背包而不是 AdminLTE 的添加。

此代码导致保存的会话变量在刷新时“被遗忘”，从而导致主题出现问题：

/* Store sidebar state */
/*         $('.sidebar-toggle').click(function(event) {
          event.preventDefault();
          if (Boolean(sessionStorage.getItem('sidebar-toggle-collapsed'))) {
            sessionStorage.setItem('sidebar-toggle-collapsed', '');
          } else {
            sessionStorage.setItem('sidebar-toggle-collapsed', '1');
          }
        });

我注释掉了，问题就解决了。

PS：这段代码位于背包默认主题的layout.blade.php中。

【讨论】：