javascript 數組轉tree結構

數組數據
var list = [
　　{id:1,pid:0,name:'一級'},
　　{id:2,pid:1,name:'一級1'},
　　{id:3,pid:1,name:'一級2'},
　　{id:4,pid:2,name:'一級1-1'}
]

 

核心代碼：

// 數組轉tree
function composeTree(list = []) {
  const data = JSON.parse(JSON.stringify(list)) // 淺拷貝不改變源數據
  const result = []
  if (!Array.isArray(data)) {
    return result
  }
  data.forEach(item => {
    delete item.children
  })
  const map = {}
  data.forEach(item => {
    map[item.id] = item
  })
  data.forEach(item => {
    const parent = map[item.pid]
    if (parent) {
      (parent.children || (parent.children = [])).push(item)
    } else {
      result.push(item)
    }
  })
  return result
}

 調用方法：

let tree = composeTree(list)

console.log(tree) // [{"id":1,"pid":0,"name":"一級","children":[{"id":2,"pid":1,"name":"一級1","children":[{"id":4,"pid":2,"name":"一級1-1"}]},{"id":3,"pid":1,"name":"一級2"}]}]

通過以上代碼轉換后的數據可以直接用於 各種樹形組件 如 element