我是Ractive js的新手。 我需要以树的形式显示组织层次结构。 我在我的Ractive模板中定义了1个数组。使用Ractive js显示树结构需要帮助
managerTeam = {M1: [T1, T2, M2, T3], M2: [M3, T4,T5], M3: [T6,T7]};
其中M1
是根经理,T1-T7
是叶节点(团队成员)
我应该怎样使用jsTree
或任何其他库显示?
我是Ractive js的新手。 我需要以树的形式显示组织层次结构。 我在我的Ractive模板中定义了1个数组。使用Ractive js显示树结构需要帮助
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": "T2"}, {"parent": "m1", "text": "M2"}, {"parent": "m1", "text": "T3"} ], "state":{"opened":true}}, { "parent": "root", "id": "m2", "text": "M2", "children": [ {"parent": "m2", "text": "M3"}, {"parent": "m2", "text": "T4"}, {"parent": "m2", "text": "T5"} ], "state":{"opened":true}}, { "id": "m3", "text": "M3", "children": [ {"parent": "m3", "text": "T6"}, {"parent": "m3", "text": "T7"} ], "state":{"opened":true}}]
jsTree
规则和运行它装载这样一个例子,你可以在这里看到:Fiddle