什么是 object-tree
object-tree 是一款方便的 JavaScript 库，它可以将对象转换成树形数据结构。如果你需要展示嵌套结构的数据，object-tree 是一个非常有用的工具。
安装
在终端里使用以下命令安装：
--- ------- -----------
如果你想在项目中使用 CDN 引入，也可以使用以下链接：
----------------------------------------------------------------------
使用方法
使用 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