菜單導(dǎo)航問題，點(diǎn)擊的時(shí)候會展開列表，再次點(diǎn)擊或點(diǎn)擊其他會收起，現(xiàn)在是點(diǎn)權(quán)限管理出來了，點(diǎn)擊電池管理權(quán)限管理不會收起，求指導(dǎo)~

1.你的意思是二級菜單不管怎么點(diǎn)擊都只展示一個(gè)吧,如果是這種需求,請望下看;
2.因?yàn)槟鉶pen屬性每個(gè)都只是通過menu獲取當(dāng)前點(diǎn)擊那個(gè)菜單,所以無法改變點(diǎn)擊之外菜單的值,我在樓上答案的基礎(chǔ)上優(yōu)化了一點(diǎn)
3.貼上代碼:(借用了樓上的代碼)

<template>
  <div id="app">
    <ul>
        <li v-for="(menu,index) in menus" :key="index">
            <a  @click="toggle(menu,index)">{{menu.name}}</a>
            <ul v-show="menu.open">
                <li v-for="(item,index) in menu.list" :key="index">{{item.name}}</li>
            </ul>

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

<script>
export default {
  data() {
    return {
      menus: [
        {
          name: "權(quán)限管理",
          open: true,
          list: [
            {
              name: "用戶管理"
            },
            {
              name: "部門管理"
            },
            {
              name: "角色管理"
            },
            {
              name: "菜單管理"
            }
          ]
        },
        {
          name: "電池管理",
          open: true,
          list: [
            {
              name: "用戶管理"
            },
            {
              name: "部門管理"
            },
            {
              name: "角色管理"
            },
            {
              name: "菜單管理"
            }
          ]
        }
      ]
    };
  },
  methods: {
    toggle(menu,index) {
      if(menu.open){
        menu.open=false
      }else{
        menu.open=true
      }  
      this.menus.forEach((item,indexMenus)=>{
         if(indexMenus!==index){
           item.open=false
         }
      })
    }
  }
};
</script>

4.實(shí)際上element有成型的導(dǎo)航欄插件tree中的accordion屬性可以控制這種效果,貼上url:http://element.eleme.io/#/zh-...
5.希望能幫到你

沒看到你寫收起其它啊，toggleChildren里刷一遍MenuList先都設(shè)置成false，或者記一下上次展開的菜單是哪一個(gè)，把它設(shè)置成false。
我記得vue列表直接更新元素屬性好像不會更新？需要用splice在原位置替換一下。自己看吧

老鐵 我根據(jù)你說的模擬了下測試代碼，我這邊是可行的，你參考下：

<div id="app">
    <ul>
        <li v-for="menu in menus">
            <a  @click="toggle(menu)">{{menu.name}}</a>
            <ul v-show="menu.open">
                <li v-for="item in menu.list">{{item.name}}</li>
            </ul>

        </li>
    </ul>
</div>
<script>
    new Vue({
        el: "#app",
        data() {
            return {
                menus: [
                    {
                        name: '權(quán)限管理',
                        open: true,
                        list: [
                            {
                                name: '用戶管理'
                            },
                            {
                                name: '部門管理'
                            },
                            {
                                name: '角色管理'
                            },
                            {
                                name: '菜單管理'
                            }
                        ]
                    },
                    {
                        name: '電池管理',
                        open: true,
                        list: [
                            {
                                name: '用戶管理'
                            },
                            {
                                name: '部門管理'
                            },
                            {
                                name: '角色管理'
                            },
                            {
                                name: '菜單管理'
                            }
                        ]
                    }
                ]
            }
        },
        methods:{
            toggle(menu){
                menu.open = !menu.open
            }
        }

    })
</script>

希望可以幫到你,如果要實(shí)現(xiàn)你的說的功能需要在toggle中添加方法：

            toggle(menu) {
                if (menu.open = true) {
                    this.menus.forEach((item) => {
                        item.open = false
                        console.log(item)
                    })
                }
                menu.open = !menu.open
            }

data(){
    return {
        leftMenuList: [
         {
              name: '權(quán)限管理',
              open: false,
              list: [
              {
                   name: '用戶管理'
              },
              {
                   name: '部門管理'
              },
              {
                    name: '角色管理'
              },
              {
                    name: '菜單管理'
              }
              ]
        },
        {
              name: '電池管理',
              open: false,
              list: [
              {
                   name: '用戶管理'
              },
              {
                   name: '部門管理'
              },
              {
                   name: '角色管理'
              },
              {
                   name: '菜單管理'
              }
              ]
         }
     ]
  }
},
methods:{
    toggleChildren(item){
        if(!item.open){
            this.leftMenuList.map((v)=>{
               v.open=false
            })
        }
        item.open=!item.open
     }
}