鍍金池/ 問答/HTML/ 關(guān)于多層循環(huán)的問題

關(guān)于多層循環(huán)的問題

1.形如以下數(shù)據(jù)結(jié)構(gòu)

 data: [{
        id: 1,
        name: '菜單1',
        list: [{
            id: 10,
            name: '2級(jí)菜單1'
          },
          {
            id: 11,
            name: '2級(jí)菜單1'
          },
          {
            id: 12,
            name: '2級(jí)菜單1'
          },
        ]
      },
      
      {
        id: 2,
        name: '菜單2',
        list: [{
            id: 20,
            name: '2級(jí)菜單1'
          },
          {
            id: 21,
            name: '2級(jí)菜單1'
          },
          {
            id: 22,
            name: '2級(jí)菜單1'
          },
        ]
      },

      {
        id: 3,
        name: '菜單3',
        list: [{
            id: 30,
            name: '2級(jí)菜單1'
          },
          {
            id: 31,
            name: '2級(jí)菜單1'
          },
          {
            id: 32,
            name: '2級(jí)菜單1'
          },
        ]
      }
    ],
    

2.如果是第一層循環(huán),可以根據(jù)index去激活當(dāng)前的樣式或者做當(dāng)前項(xiàng)的邏輯,但是內(nèi)層循環(huán)出來(lái),那些2級(jí)菜單該如何去激活樣式呢,index肯定是不行的

回答
編輯回答
青瓷

圖片描述

先上圖,如果你可以從圖中看明白就不用看一下內(nèi)容了、、、、、
主要思路-----》有兩個(gè)值來(lái)記錄點(diǎn)擊子菜單的選中狀態(tài),當(dāng)點(diǎn)擊每一個(gè)子菜單時(shí),需要把父級(jí)的index和list的index更新到該組件的data里面,即可實(shí)現(xiàn)。。

2017年2月3日 19:16
編輯回答
瘋子范
2017年1月20日 20:28
編輯回答
耍太極

vue的select group你可以去看看

2017年3月26日 13:04
編輯回答
涼汐

可以選擇做一個(gè)遞歸,或者只有定死的2級(jí)菜單,直接加一個(gè)判斷就好了.

2017年4月10日 16:25
編輯回答
單眼皮

沒太明白你的需求,

給個(gè)建議吧,二級(jí)菜單的時(shí)候,用一層循環(huán)的id加上二層循環(huán)的index作為唯一的標(biāo)識(shí)來(lái)激活樣式

不知道這樣能否滿足你的需求

2018年6月19日 16:07
編輯回答
愛礙唉

遞歸完勝!

先利用將所有的菜單都獲取到(變成平級(jí)菜單)
 
然后根據(jù)當(dāng)前路由的菜單來(lái)激活樣式
      
2018年3月11日 01:31
編輯回答
痞性

采用遞歸好點(diǎn)

2018年3月13日 06:16