"id" 如何使用 JSON 填充 jsTree

Question

我正在使用另一种 JSON 格式来填充我的 jsTree，如此 link.

问题是我找不到 "id" 属性在 jsTree 中的工作原理？

在我的例子中，parent有时可以有相同的名字。（这并不理想，但它是一种罕见的情况，所以我必须处理它）。所以我在树中使用他们独特的"id's"。现在，如果 parent 的子节点与 parent 节点具有相同的 "id"，那么 jsTree 将无法在单击按钮时正常工作并继续显示 "Loading.." 消息。

我的JSON:

[
  {
    "id": "3",         //Any value except 3 and 5 works
    "text": "Ford",
    "parent": "3",
    "icon": "fa fa-circle-o"
  },
  {
    "id": "5",        //Any value except 3 and 5 works
    "text": "Fiat",
    "parent": "5",
    "icon": "fa fa-circle-o"
  },
  {
    "id": "3",
    "text": "Cars",
    "parent": "#",
    "icon": "glyphicon glyphicon-triangle-right"
  },
  {
    "id": "5",
    "text": "Cars",
    "parent": "#",
    "icon": "glyphicon glyphicon-triangle-right"
  }
]

我的html代码：

 <div id="car-list" class="collapse">
                       #{MyBean.jsonString}
                   </div>
                   <h:outputScript>
                       $(function() {
                           var data1= JSON.parse(document.getElementById("car-list").innerHTML);
                           $('#car-list').jstree({
                               'core': {
                                   'data': data1
                               }
                           });
                       });
                   </h:outputScript>

其中 jsonString 是一个包含上述 json

的字符串 object

Answer 1

在 jstree 中，每次我有 2 个相同的键时，我只能看到呈现的一个元素，而不是 2 个（谈论具有相同键的元素）。在您的情况下，我想问题是您的节点中有循环，因此渲染永远不会结束。我通过连接创建键 (parentKey_childKey) 解决了我的问题。所以在你的情况下，这将是：

[
  {
    "id": "3_3",         
    "text": "Ford",
    "parent": "3",
    "icon": "fa fa-circle-o"
  },
  {
    "id": "5_5",        
    "text": "Fiat",
    "parent": "5",
    "icon": "fa fa-circle-o"
  },
  {
    "id": "3",
    "text": "Cars",
    "parent": "#",
    "icon": "glyphicon glyphicon-triangle-right"
  },
  {
    "id": "5",
    "text": "Cars",
    "parent": "#",
    "icon": "glyphicon glyphicon-triangle-right"
  }
]

您还可以看到不支持具有相同键的多个节点here。

"id" 如何使用 JSON 填充 jsTree

How "id" works in populating jsTree using JSON

javascript

jquery

json

jstree