什么是 object-tree
object-tree 是一款方便的 JavaScript 库，它可以将对象转换成树形数据结构。如果你需要展示嵌套结构的数据，object-tree 是一个非常有用的工具。
安装
在终端里使用以下命令安装：
npm install object-tree
如果你想在项目中使用 CDN 引入，也可以使用以下链接：
https://cdn.jsdelivr.net/npm/object-tree@1.0.0/dist/object-tree.min.js
使用方法
使用 object-tree 很简单。你只需要引入库，然后使用 objectTree(data, config) 方法将数据转换成树形结构。
-- -------------------- ---- ------- -- -- ----------- ------ ---------- ---- ------------- -- -- ----- ---- - - --- -- ----- ----- ----- --------- - - --- -- ----- ----- ----- --------- -- -- - --- -- ----- -------- --------- - - --- -- ----- ------ --------- -- - - - - - -- ------- ----- ---- - ---------------- -----------------展开代码
输出结果如下：
-- -------------------- ---- ------- - - --- -- ----- ----- ----- --------- - - --- -- ----- ----- ----- --------- -- -- - --- -- ----- -------- --------- - - --- -- ----- ------ --------- -- - - - -- --------- ----- ------ -- ------ -- ------- ----- -- - --- -- ----- ----- ----- --------- --- --------- -- ------ -- ------ -- ------- ---- -- - --- -- ----- -------- --------- - - --- -- ----- ------ --------- -- - -- --------- -- ------ -- ------ -- ------- ----- -- - --- -- ----- ------ --------- --- --------- -- ------ -- ------ -- ------- ---- - -展开代码
可以看到，objectTree() 方法将数据转换成了一个数组，每个元素都是数据中的一个节点，还包含了一些额外信息，比如节点深度、是否为叶子节点等。
配置参数
objectTree() 方法还支持一个配置对象，可以用来自定义输出的树形结构。以下是可用的配置选项：
idProp：表示节点的 id 属性名，默认为'id'。parentIdProp：表示节点的 parent id 属性名，默认为'parentId'。childrenProp：表示子节点的数组属性名，默认为'children'。isLeaf：一个函数，用来判断节点是否为叶子节点。默认判断方式是判断子节点数量是否为 0。
使用配置的示例如下：
-- -------------------- ---- ------- ----- ------ - - ------- ------ ------------- ------------ ------------- ------- ------------ - ------ -------------------- - - - - ----- ---- - ---------------- -------展开代码
结束语
object-tree 是一个轻量、易用的 JavaScript 库，可以帮你快速将嵌套结构的数据转换成树形结构。如果你需要在前端展示树形结构数据，不妨试试 object-tree。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66962
