Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/77.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 容器中未显示JSTree_Javascript_Html_Jstree - Fatal编程技术网

Javascript 容器中未显示JSTree

Javascript 容器中未显示JSTree,javascript,html,jstree,Javascript,Html,Jstree,我正在尝试将JSTree结构合并到我的javascript项目中;但是,树似乎没有在其父容器中显示/渲染。下面是我用来显示树的代码: let tree=this.tree_div.find('#treeDiv'); tree.jstree( { "json_data": { "data": [ { "da

我正在尝试将JSTree结构合并到我的javascript项目中;但是,树似乎没有在其父容器
中显示/渲染。下面是我用来显示树的代码:

let tree=this.tree_div.find('#treeDiv');
    tree.jstree(
        {
            "json_data": 
            {
                "data": [
                    {
                        "data": "First",
                        "children": [{"data": "First"},{"data":"Second"},{"data": "Third"}]
                    },
                    {
                        "data": "Second",
                        "children": [{"data":"First"},{"data":"Second"},{"data": "Third"}]
                    },
                    {
                        "data": "Third",
                        "children": []
                    }

                ],
            },
            "plugins": ["checkbox","themes", "html_data", "ui"]

        }
    ).bind("select_node.jstree", function(e, data){});
    console.log(tree[0]);
在本例中,
#treeDiv
是父
容器所包含的
div

在打印树值的最后一行中,控制台中出现以下行:


据我所知,这意味着树正在成功初始化和设置,但它仍然没有显示在网页上。如有任何意见,将不胜感激。谢谢。

这里最合理的解释是,您正在使用较旧的jsTree API初始化树,同时使用较新的jsTree库

旧JSON API:

新的JSON API:

较新的API具有用于填充树的不同对象结构。一些函数和事件保持不变,但包括配置对象在内的许多其他内容都发生了更改

myTree.jstree({ 'core' : {
    'data' : [
       'Simple root node',
       {
         'text' : 'Root node 2',
         'state' : {
           'opened' : true,
           'selected' : true
         },
         'children' : [
           { 'text' : 'Child 1' },
           'Child 2'
         ]
      }
    ]
} });