AdminLTE 扩展侧边栏子菜单在 Flask 中折叠答案

【问题标题】：AdminLTE expanded sidebar submenu collapses in FlaskAdminLTE 扩展侧边栏子菜单在 Flask 中折叠
【发布时间】：2018-02-26 07:56:57
【问题描述】：

我是网络开发的初学者。我正在尝试在我的烧瓶应用程序中使用AdminLTE。我基本上将 adminLTE 的内容复制到一个文件夹static 中，然后通过更改 href 引用所有 adminLTE 样式表和 javascript，例如：从 href="../../dist/css/AdminLTE.min.css" 到 href="static/dist/css/AdminLTE.min.css"

flask_app/
    app.py
    static/
        bower_components/
        css/
        dist/
        fonts/
        js/
        plugins/
    templates/
        mypage1.html
        mypage2.html

这适用于我的页面mypage1.html 和mypage2.html，但我遇到的问题是侧边栏菜单和子菜单。假设mypage2.html 是一个子菜单，当我展开并单击mypage1.html 的链接时，它会重新加载整个页面，从而折叠子菜单。当mypage2.html 加载时，如何保持状态以使子菜单保持展开状态。

这是侧边栏的 sn-p：

<ul class="sidebar-menu">
<li class="header">HEADER</li>
<li class="active">
   <a href="{{ url_for('mypage1') }}">
   <i class="fa fa-dashboard"></i> <span>MyPage1</span>
   </a>
</li>
<li class="treeview">
   <a href="#">
   <i class="fa fa-folder"></i>
   <span>Submenu</span>
   <i class="fa fa-angle-left pull-right"></i>
   </a>
   <ul class="treeview-menu">
      <li>
         <a href="{{ url_for('mypage2') }}">
         <i class="fa fa-circle-o"></i>
         MyPage2
         </a>
      </li>
   </ul>
</li>
</ul>

【问题讨论】：

标签： html flask adminlte

【解决方案1】：

你需要在ul treeview-menu中添加css类名：menu-open，同时将ccs类名active移动到需要活动的li元素，像这样：

<ul class="sidebar-menu">
<li class="header">HEADER</li>
<li>
   <a href="{{ url_for('mypage1') }}">
   <i class="fa fa-dashboard"></i> <span>MyPage1</span>
   </a>
</li>
<li class="treeview">
   <a href="#">
   <i class="fa fa-folder"></i>
   <span>Submenu</span>
   <i class="fa fa-angle-left pull-right"></i>
   </a>
   <ul class="treeview-menu menu-open">
      <li class="active">
         <a href="{{ url_for('mypage2') }}">
         <i class="fa fa-circle-o"></i>
         MyPage2
         </a>
      </li>
   </ul>
</li>
</ul>

【讨论】：