树形结构已知子节点获取子节点所有父节点——任意目录/树

JS 树形结构 根据子节点找到所有上级，比如element-tree，已知路由上的子结点id，如何回填的 展开目录树？

树的查找与遍历都非常简单，具体可以查看我之前写的：《讲透学烂二叉树(三)：二叉树的遍历图解算法步骤及JS代码》

或者：JS树结构操作:查找、遍历、筛选、树和列表相互转换 https://wintc.top/article/20

但是 如何根据子结点找所有父节点的目录的呢？之前的遍历与查找的代码并不能解决这个问题，这里我单独给出一段代码：

export default function findParents(arr, id, findProps = 'id', childProps = 'children') {
  const stock = [];
  let going = true;
  function recursion(arr, id, findProps, childProps) {
    arr.forEach((item) => {
      if (!going) return;
      stock.push(item[findProps]);
      if (item[findProps] === id) {
        going = false;
      } else if (item[childProps]) {
        recursion(item[childProps], id, findProps, childProps);
      } else {
        stock.pop();
      }
    });
    if (going)  stock.pop();
  }
  recursion(arr, id, findProps, childProps);
  return stock;
}

比如：

function findParents(arr, id, findProps = 'id', childProps = 'children') {
  const stock = [];
  let going = true;
  function recursion(arr, id, findProps, childProps) {
    arr.forEach((item) => {
      if (!going) return;
      stock.push(item[findProps]);
      if (item[findProps] === id) {
        going = false;
      } else if (item[childProps]) {
        recursion(item[childProps], id, findProps, childProps);
      } else {
        stock.pop();
      }
    });
    if (going)  stock.pop();
  }
  recursion(arr, id, findProps, childProps);
  return stock;
}



var a = [
  {
    'id': 68,
    'space_id': 1,
    'title': '33333',
    'folder_id': 0,
    'is_folder': true,
    'is_default': false,
    'build_in': true,
    'created_by': 'andyljzhou',
    'updated_by': 'andyljzhou',
    'created_time': '2022-04-21T11:41:09.863650Z',
    'updated_time': '2022-04-21T11:42:56.004976Z',
    'children': [
      {
        'id': 72,
        'space_id': 1,
        'title': '333',
        'folder_id': 68,
        'is_folder': true,
        'is_default': false,
        'build_in': true,
        'created_by': 'andyljzhou',
        'updated_by': 'andyljzhou',
        'created_time': '2022-04-21T11:58:03.376084Z',
        'updated_time': '2022-04-21T11:58:03.376115Z',
        'children': [
          {
          'id': 82,
          'space_id': 1,
          'title': '面板',
          'folder_id': 72,
          'is_folder': false,
          'is_default': false,
          'build_in': true,
          'created_by': 'andyljzhou',
          'updated_by': 'andyljzhou',
          'created_time': '2022-04-22T03:36:44.364097Z',
          'updated_time': '2022-04-22T03:36:44.364130Z',
          'children': []
        }]
      }, {
        'id': 75,
        'space_id': 1,
        'title': '222',
        'folder_id': 68,
        'is_folder': true,
        'is_default': false,
        'build_in': true,
        'created_by': 'andyljzhou',
        'updated_by': 'andyljzhou',
        'created_time': '2022-04-21T12:06:48.781045Z',
        'updated_time': '2022-04-21T12:06:48.781077Z',
        'children': []
      }]
  }
]


console.log(findParents(a,82))

这样就可以查找满足任意前端组件 tree 的回填了

转载本站文章《树形结构已知子节点获取子节点所有父节点——任意目录/树》,
请注明出处：https://www.zhoulujun.cn/html/webfront/ECMAScript/js/2022_0422_8797.html