JS實現 JSON扁平數據轉換樹狀數據

后台我拿的數據是這樣的格式:

[
{id:1 , parentId: 0, name: '', level: 0},
{id:2 , parentId: 0, name: '', level: 0},
{id:3 , parentId: 2, name: '', level: 1},
{id:4 , parentId: 2, name: '', level: 1},
{id:5 , parentId: 4, name: '', level: 2},
]

 

 

 轉換后的數據差不多就是這樣的格式

{
    [
        {
            id: 1,
            name: ''
        },
        {
            id: 2,
            name: '',
            children: [
                {
                    id: 3
                },
                {
                    id: 4,
                    children: [
                        {
                            id: 5
                        }
                    ]
                }
            ]
        },
    ]
}

js轉換方式

 

后台獲取數組 jsonData 然后轉換成樹狀的方式

 

  //吧后台json轉換成樹狀形式
    format(jsonData) {
      var result = [], temp = {}, i = 0, j = 0, len = jsonData.length
      for (; i < len; i++) {
        temp[jsonData[i]['menuId']] = jsonData[i] // 以id作為索引存儲元素，可以無需遍歷直接定位元素
      }
      for (; j < len; j++) {
        var currentElement = jsonData[j]
        var tempCurrentElementParent = temp[currentElement['parentId']] // 臨時變量里面的當前元素的父元素 parentId 父級ID
        if (tempCurrentElementParent) { // 如果存在父元素
          if (!tempCurrentElementParent['children']) { // 如果父元素沒有chindren鍵
            tempCurrentElementParent['children'] = [] // 設上父元素的children鍵
          }
          tempCurrentElementParent['children'].push(currentElement) // 給父元素加上當前元素作為子元素
        } else { // 不存在父元素，意味着當前元素是一級元素
          result.push(currentElement);
        }
      }
    
      return result;
    }