在 AdminLTE 3.0 中点击子菜单时如何折叠 nav-treeview？

Question

正如您在 GIF 中看到的那样，当我单击子菜单时它不再折叠。我想要的是当我点击子菜单时它会折叠并且不会在我点击页面时自动关闭

<li class="nav-item">
            <a href="#" class="nav-link <?= $page == 'patients.php' || $page == 'medical_history.php'? 'active':''?>">
              <i class="nav-icon fa fa-users-medical"></i>
              <p>Patients</p>
              <i class="fas fa-angle-left right"></i>
            </a>
            <ul class="nav nav-treeview <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'show':''?>">
              <li class="nav-item">
                <a href="patients.php" class="nav-link <?= $page == 'patients.php' ? 'active':''?>">
                  <i class="far fa-circle nav-icon"></i>
                  <p>Patient List</p>
                </a>
              </li>
              <li class="nav-item">
                <a href="medical_history.php" class="nav-link <?= $page == 'medical_history.php' ? 'active':''?>">
                  <i class="far fa-circle nav-icon"></i>
                  <p>Medical History</p>
                </a>
              </li>
            </ul>
          </li>

Answer 1

如果您的 AdminLTE 模板使用 bootstrap，则尝试在在 nav-treeview class.

之后嵌套 ul 元素

Answer 2

已更新...

我已经更新并提供了您需要的代码...只需将此代码复制并粘贴到文件的相关部分即可。我相信这对你有用:)

<li class="nav-item <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'menu-open' : '' ?>">
  <a href="#" class="nav-link <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'active' : '' ?>">
    <i class="nav-icon fa fa-users-medical"></i>
    <p>Patients</p>
    <i class="fas fa-angle-left right"></i>
  </a>
  <ul class="nav nav-treeview">
    <li class="nav-item">
      <a href="patients.php" class="nav-link <?= $page == 'patients.php' ? 'active' : '' ?>">
        <i class="far fa-circle nav-icon"></i>
        <p>Patient List</p>
      </a>
    </li>
    <li class="nav-item">
      <a href="medical_history.php" class="nav-link <?= $page == 'medical_history.php' ? 'active' : '' ?>">
        <i class="far fa-circle nav-icon"></i>
        <p>Medical History</p>
      </a>
    </li>
  </ul>
</li>

Answer 3

只需添加display: none

<ul class="nav nav-treeview" style="display: none;">

在 AdminLTE 3.0 中点击子菜单时如何折叠 nav-treeview？

How to collapsed nav-treeview when I click the submenu in AdminLTE 3.0?

javascript

php

adminlte