树结构转扁平化数组

树结构转扁平化数组的基本方法都是使用递归，实际情况需要根据自己的需求去修改自己需要的字段。 先模拟一个简单的树结构

let tree = [
  {
    id: 1,
    label: '第一级',
    children: [
      {
        id: 11,
        label: '第1-1级',
        children: [
          {
            id: 111,
            label: '第1-1-1级',
          },
          {
            id: 112,
            label: '第1-1-2级',
          }
        ]
      }
    ]
  },
  {
    id: 2,
    label: '第二级',
    children: [
      {
        id: 21,
        label: '第2-1级',
      },
      {
        id: 22,
        label: '第2-2级',
      }
    ]
  }
]

第一种方法

function treeToArr(arr) {
  let newArr = []
  arr.forEach(obj => {
    let newObj = {
      id: obj.id,
      label: obj.label
    }
    newArr.push(newObj)
    if (obj.hasOwnProperty('children')) {
      newArr = newArr.concat(treeToArr(obj.children))
    }
  });
  return newArr;
}

// 输出结果
[
  { id: 1, label: '第一级' },
  { id: 11, label: '第1-1级' },
  { id: 111, label: '第1-1-1级' },
  { id: 112, label: '第1-1-2级' },
  { id: 2, label: '第二级' },
  { id: 21, label: '第2-1级' },
  { id: 22, label: '第2-2级' }
]

有的树结构字段比较多，但实际只能使用到2~3个字段，所以我定义了 newObj 只取自己需要的字段，如果不需要可以直接去掉。

第二种方法

function treeToArr(data) {
  return data.reduce((arr, {id, label, children = []}) => 
      arr.concat([{id, label}], treeToArr(children)), []);
}

2个方法实际都是使用了递归去解决这个问题，第二个代码更简洁，可以根据自己的喜好去选择。

扁平化数组转树结构

let arr = [
  {id: 1, label: '第一级', pid: 0},
  {id: 2, label: '第二级', pid: 0},
  {id: 11, label: '第1-1级', pid: 1},
  {id: 12, label: '第1-2级', pid: 1},
  {id: 111, label: '第1-1-1级', pid: 11},
  {id: 21, label: '第2-1级', pid: 2},
]

function ArrToTree(arr) {
  const treeData = []
  arr.forEach(item=>{
      if(!item.pid){
        treeData.push(item)
      }
      const children = list.filter(data=>data.pid ===item.id)
      if(!children.length) return
      item.children=children
  })
  return treeData
}

方法都是比较简单实用的，希望可以帮到大家。