Question

我发现此代码实现了动态递归菜单，但是我想增加级别，例如：

Level 1: Item 1
 Level 2: Item 1.1
Level 1: Item 2
 Level 2: Item 2.1
  Level 3: Item 2.1.1
 Level 2: Item 2.2
Level 1: Item 3

<?php
require_once __DIR__ . '/../conn/conn.php';
?>
<html>
<head>
    <meta charset="utf-8">
    <title>Title</title>

    <!-- Bootstrap Core CSS -->
    <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="../vendor/metisMenu/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="../dist/css/sb-admin-2.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="../vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

</head>

<body>
    <div class="navbar-default sidebar" role="navigation">
        <div class="sidebar-nav navbar-collapse">

            <?php
            //Recursive php function
            class MenuItem {
                /** @var int */
                public $idmenu;
                /** @var int */
                public $idmenu_parent;
                /** @var string */
                public $desc_menu;
                /** @var string */
                public $url_menu;
                /** @var int */
                public $ordem;
                /** @var array */
                public $sons = array();

                /**
                 * HTML.
                 */

                public

                function getHtml() { 

                    $html = '<li><a href="' . $this->url_menu . '"><i class="' . $this->icone_menu . '"></i> ' . $this->desc_menu;

                    if ( !empty( $this->sons ) ) {
                        $html .= '<span class="fa arrow"></span>';

                    }
                    $html .= '</a>';

                    if ( !empty( $this->sons ) ) {

                        $html .= '<ul class="nav nav-second-level" ' . $i . '>';

                        foreach ( $this->sons as $son ) {

                            $html .= $son->getHtml();
                        }
                        $html .= '</ul>'; 

                    } 
                    $html .= '</li>';
                    return $html;
                }
            }

            $pdo = new PDO( 'mysql:dbname=pbl;host=localhost', 'root', '' );

            // menu items
            $rs = $pdo->query( "SELECT * FROM menu ORDER BY idmenu" );
            // temp list
            $menu_tmp = array();
            // class
            $rs->setFetchMode( PDO::FETCH_CLASS, 'MenuItem' );
            // item menu
            while ( $row = $rs->fetch() ) {
                // temp list
                // index id menu
                $menu_tmp[ $row->idmenu ] = $row;

            }
            // indexed list
            // sons in parents
            foreach ( $menu_tmp as $item ) {
                // id parent
                if ( !empty( $item->idmenu_parent ) ) {
                    // sons in parent
                    $menu_tmp[ $item->idmenu_parent ]->sons[] = $item;
                }
            }

            // final list
            $menu_final = array();
            // only parent
            foreach ( $menu_tmp as $menu ) {
                if ( empty( $menu->idmenu_parent ) ) {
                    $menu_final[] = $menu;
                }
            }

            // result
            echo '<ul class="nav" id="side-menu">';
            foreach ( $menu_final as $menu ) {              
                echo $menu->getHtml();
            }
            echo '</ul>';
            ?>
        </div>
    </div>

    <!-- jQuery -->
    <script src="../vendor/jquery/jquery.min.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="../vendor/bootstrap/js/bootstrap.min.js"></script>

    <!-- Metis Menu Plugin JavaScript -->
    <script src="../vendor/metisMenu/metisMenu.min.js"></script>

    <!-- Custom Theme JavaScript -->
    <script src="../dist/js/sb-admin-2.js"></script>

</body>
</html>

但是结果是这样的：

<html>
<head>
<meta charset="utf-8">
<title>Title</title>

<!-- Bootstrap Core CSS -->
<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<!-- MetisMenu CSS -->
<link href="../vendor/metisMenu/metisMenu.min.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="../dist/css/sb-admin-2.css" rel="stylesheet">

<!-- Custom Fonts -->
<link href="../vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
</head>

<body>
<div class="navbar-default sidebar" role="navigation">
  <div class="sidebar-nav navbar-collapse">
    <ul class="nav" id="side-menu">
      <li><a href="#"><i class="fa fa-wrench fa-fw"></i> Item 1<span class="fa arrow"></span></a>
        <ul class="nav nav-second-level">
          <li><a href="menu.php"><i class="fa fa-bars fa-fw"></i> Item 1.1</a></li>
        </ul>
      </li>
      <li><a href="#"><i class="fa fa-table fa-fw"></i> Item 2<span class="fa arrow"></span></a>
        <ul class="nav nav-second-level">
          <li><a href="#"><i class=""></i> Item 2.1<span class="fa arrow"></span></a>
            <ul class="nav nav-second-level">
              <li><a href="bom.php"><i class=""></i> Item 2.1.1</a></li>
              <li><a href="mirgor.php"><i class=""></i> Item 2.1.2</a></li>
            </ul>
          </li>
          <li><a href="#"><i class=""></i> Item 2.2<span class="fa arrow"></span></a>
            <ul class="nav nav-second-level">
              <li><a href="etd2.php"><i class=""></i> Item 2.2.1</a></li>
            </ul>
          </li>
        </ul>
      </li>
      <li><a href="http://brmns066:9191/"><i class="fa fa-print fa-fw"></i> Item</a></li>
      </li>
    </ul>
  </div>
</div>

<!-- jQuery --> 
<script src="../vendor/jquery/jquery.min.js"></script> 

<!-- Bootstrap Core JavaScript --> 
<script src="../vendor/bootstrap/js/bootstrap.min.js"></script> 

<!-- Metis Menu Plugin JavaScript --> 
<script src="../vendor/metisMenu/metisMenu.min.js"></script> 

<!-- Custom Theme JavaScript --> 
<script src="../dist/js/sb-admin-2.js"></script>
</body>
</html>

我想增加此代码：

<ul class="nav nav-second-level">
              <li><a href="bom.php"><i class=""></i> Item 2.1.1</a></li>
              <li><a href="mirgor.php"><i class=""></i> Item 2.1.2</a></li>
            </ul>

收件人：

<ul class="nav nav-third-level">
              <li><a href="bom.php"><i class=""></i> Item 2.1.1</a></li>
              <li><a href="mirgor.php"><i class=""></i> Item 2.1.2</a></li>
            </ul>

Answer 1

在您的课程中添加一个“ $ order”属性（或者也许已经定义但未使用的“ $ ordem”属性的目的）。

给$ order一个默认值1，然后，对于MenuItem的每个儿子，将该值递增1：

// sons in parents
foreach ( $menu_tmp as $item ) {
    // id parent
    if ( !empty( $item->idmenu_parent ) ) {
        // sons in parent
        $item->order = $menu_tmp[ $item->idmenu_parent ]->order + 1;
        $menu_tmp[ $item->idmenu_parent ]->sons[] = $item;
    }
}

然后，您必须检查$ order的值并相应地选择nav类：

if ( !empty( $this->sons ) ) {
    switch($this->order) {
        case 1:
            $html .= '<ul class="nav nav-second-level" ' . $i . '>';
        case 2:
            $html .= '<ul class="nav nav-third-level" ' . $i . '>';
        case 3:
            $html .= '<ul class="nav nav-fourth-level" ' . $i . '>';
        default:
            $html .= '<ul class="nav nav-'.($this->order + 1).'-level" ' . $i . '>';
    }

    foreach ( $this->sons as $son ) {

        $html .= $son->getHtml();
    }
    $html .= '</ul>'; 

}

如果您可以自由选择导航类的名称，建议您将所有开关替换为在“默认”情况下编写的表达式（但这是个人喜好问题）。

我不能增加下一个水平

1 个答案: