从树中找到特定的那条线,再将线转换为树

176 阅读1分钟

先看下数据

点击查看
const nodes = [
  {
    id: 1,
    label: "一级 1",
    pid: 0,
    children: [
      {
        id: 4,
        pid: 1,
        label: "二级 1-1",
      }
    ],
  },
  {
    id: 2,
    label: "一级 2",
    pid: 0,
  },
  {
    id: 3,
    label: "一级 3",
    pid: 0,
    children: [
      {
        id: 7,
        label: "二级 3-1",
        pid: 3,
        children: [
          {
            id: 9,
            label: "4级 4-1",
            pid: 7,
          },
        ]
      },
      {
        id: 8,
        label: "二级 3-2",
        pid: 3,
      },
    ],
  },
];

开始处理,找到那个值处于哪条线上

// 找到树上的一条线
function findIndexArray(data, id, indexArray) {
  let arr = Array.from(indexArray)
  for (let i = 0, len = data.length; i < len; i++) {
    arr.push({ id: data[i].id, label: data[i].label ,pid:data[i].pid})
    if (data[i].id === id) {
      return arr
    }
    let children = data[i].children
    if (children && children.length) {
      let result = findIndexArray(children, id, arr)
      if (result)
        return result
    }
    arr.pop()
  }
  return false
}
// console.log(findIndexArray(nodes, 9, []))  => 
[
  { id: 3, label: '一级 3', pid: 0 },
  { id: 7, label: '二级 3-1', pid: 3 },
  { id: 9, label: '4级 4-1', pid: 7 }
]

这条线上的数据拿到了,那么开始吧线上的数据构成一条树

// 把线构成树
function toTree(data) {
  let result = [];
  if (!Array.isArray(data)) {
    return result
  }
  // data.forEach(item => {
  //   delete item.children;
  // });
  let map = {};
  data.forEach(item => {
    map[item.id] = item;
  });
  data.forEach(item => {
    let parent = map[item.pid];
    if (parent) {
      (parent.children || (parent.children = [])).push(item);
    } else {
      result.push(item);
    }
  });
  return result;
}
console.log(toTree(findIndexArray(nodes, 9, []))[0])
/**
{
  id: 3,
  label: '一级 3',
  pid: 0,
  children: [{
    id: 7,
    label: '二级 3-1',
    pid: 3,
    children: [
      {
        id: 9,
        label: "4级 4-1",
        pid: 7,
      },
    ]
  }]
}
*/
笔记,解构树
// 树状数据添加
recursiveget(treedata) {
  for (var i in treedata) {
    if (treedata[i].type == 'area') {
      treedata[i].icon = 'el-icon-map-location'
      this.recursiveget(treedata[i].children)
      this.defaultTree.push(treedata[i].id)
    }else {
      treedata[i].icon = 'el-icon-school'
      this.recursiveget(treedata[i].children)
    }
  }
  return treedata
},