Javascript 需要使用Ractive js显示树结构的帮助吗

我是个新手。 我需要以树的形式显示组织层次结构。 我有一个数组定义在我的Ractive模板中

managerTeam = {M1: [T1, T2, M2, T3], M2: [M3, T4,T5],  M3: [T6,T7]}; 

其中，

M1

是根管理器，

T1-T7

是叶节点（团队成员）

---

我应该如何使用

jsTree

或任何其他库显示它？

要使用jsTree，您必须：

将

jsTree

库添加到页面

将您的

managerTeam

对象转换为

jsTree

可接受的格式，如下所示：

managerTeam=[{“id”：“m1”，“text”：“m1”，“children”：[{“parent”：“m1”，“text”：“T1”}，{“parent”：“m1”，“text”：“M2”}，{“parent”：“m1”，“text”：“T3”}]，“state”：{“opened”：“true”}，{“parent”：“root”，“id”：“M2”，“text”：“M2”，“M2”，“children{“父项”：“m2”、“文本”：“T5”}]、“状态”：{“打开的”：真的}、{“id”：“m3”、“文本”：“m3”、“子项”：[{“父项”：“m3”、“文本”：“T6”}、{“父项”：“m3”、“文本”：“T7”}]、“状态”：{“打开的”：真的}]

根据

jsTree

规则为页面上的div编写一些配置代码，这些代码将变成树，并在加载DOM后运行

您可以在此处看到一个示例：