前端实现一次menu侧边栏

let Array = [{
  title: "管理",
  routeName: "order",
  icon: "",
  path: "",
  expanded: false,   // 开始关闭状态
    routeArray:['orderList'], // 子路的routeName   我是作为了高亮展开的标识
  children: [{
    title: "列表",
    path: "",
    routeName: "orderList",
  }]
},]

<ul class="menu">
      <li v-for="(item, index) in navList" :key="index"
        style="height：40px">
        <span @click.stop="toggleItem(item)" id="expanded""></i> {{ item.title }} <i :class="item.expanded ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i></span>
        <div>
          <ul class="menu_box">

   <li v-for="(i, j) in item.children" :key="j" style="transition: 'all .5s ease' ">
            <span><router-link :to="i.routeName"><span

           </router-link></span>

            </li>
          </ul>
        </div>
      </li>
    </ul>

  toggleItem(item) {
      if (this.isCollapse) {
        this.shrinkMenu()
        return false
      }
      if (item.expanded) {
        this.navList.forEach(element => {
          element.expanded = false
        });
        return false
      }
      this.navList.forEach(element => {
        element.expanded = false
      });
      item.expanded = !item.expanded
    }