如何在Materialize中向sidenav添加子菜单？

Question

如何将子菜单添加到以下sidenav？

<ul class="sidenav sidenav-fixed" id="nav-mobile" style="width:250px">
  <li> <a href="#" class="brand-logo center">Text here</a></li>
  <li>
    <div class="divider"></div>
  </li>

  <li>
    <a onclick="load('home')"><i class="material-icons">home</i>Home</a>
  </li>

  <li><a onclick="load('intro')"><i class="material-icons">apps</i>Content Table</a></li>

</ul>

Answer 1

您可以使用MaterializeCSS进行以下类似操作

<div id="slide-out" class="sidenav" style="transform: translateX(0%);">
   <ul class="collapsible">
    <li class="active">
      <div class="collapsible-header">
        <a href="#/groups/1" class="router-link-exact-active router-link-active">Group1</a>
      </div> <div class="collapsible-body" style="display: block;">
       <li><a href="#/courses/1" class="waves-effect">Course 1</a></li>
       <li><a href="#/courses/2" class="waves-effect">Course 2</a></li>
      </div>
    </li>
    <li class="">
     <div class="collapsible-header">
       <a href="#/groups/2" class="">केंद्रीय लोकसेवा  आयोग </a>
     </div> 
     <div class="collapsible-body" style="">
     </div>
    </li>
  </ul>
</div>