tree-utils 树工具

1. 介绍

将 list 转化为 tree

将 tree 转化为 list

可以指定 id、parentId、children 属性的名称

parentId 为 null 的节点为 根节点

2. 使用

安装:

npm i simple-tree-utils

示例:

import { TreeUtils } from 'simple-tree-utils';

const simpleTreeUtils = new TreeUtils({
  idProp: 'id', // the key of a unique identifier for an object (source object)
  parentIdProp: 'parentId', // the key of a unique parent identifier (source object)
  childrenProp: 'children', // the key, where child nodes are stored (destination object tree)
});

simpleTreeUtils.list2Tree(list);

simpleTreeUtils.tree2List(tree);


const list = [
  {id: 1, parentId: null, name: 'Node 1'},
  {id: 2, parentId: null, name: 'Node 2'},
  {id: 3, parentId: 1, name: 'Node 3'},
  {id: 4, parentId: 1, name: 'Node 4'},
  {id: 5, parentId: 2, name: 'Node 5'},
  {id: 6, parentId: 3, name: 'Node 6'},
];

const tree = [
  {
    id: 1, 
    parentId: null, 
    name: 'Node 1', 
    children: [
      {
        id: 3, 
        parentId: 1, 
        name: 'Node 3', 
        children: [
          { id: 6, parentId: 3, name: 'Node 6', children: [] },
        ]
      },
      { id: 4, parentId: 1, name: 'Node 4', children: [] },
    ]
  },
  {
    id: 2, 
    parentId: null, 
    name: 'Node 2', 
    children: [
      { id: 5, parentId: 2, name: 'Node 5', children: [] },
    ]
  },
];

3. 参考

• simple-tree-utils —— NPM (opens new window)