Jstree:无法读取未定义的属性子元素。时间问题?

时间:2016-07-22 07:47:08

标签: javascript jquery jstree

我有一个对象数组,其中每个对象看起来都像这样的结构:

var data = [{
"code" : "i1",
"name" : "Industry 1",
"parentCode" : "i0"
}, 
{
//and more items just like that one
}];

所以我使用jstree来构建层次结构视图。由于jstree需要idtext,我会像这样映射data数组:

datatree = $.map(data, function (item) {

        return {
            id : item.code,
            text : item.name,
            parent : item.parentCode

        };

    });

然后我初始化hierarchy div中的实际树:

$('#hierarchy').jstree({

    "core": {
        "themes": {
            "variant": "large"
        },
        "data": datatree,
    },
    'check_callback': true,
    "checkbox": {
        "keep_selected_style": false
    },
    "plugins": ["wholerow", "search", "unique"]
});

这构建树并且在原始数组非常简单时可以正常工作,可能是父级的一个或两个级别。但是,如果我使用完全相同的方式测试替代数组,但是有5个级别的父级,则控制台会抛出错误:

Uncaught TypeError: Cannot read property 'children' of undefined

它指向jstree原始代码中的这一行:

k[c[o].parent.toString()].children.push(c[o].id.toString()),

我怀疑它是一个计时问题,因为jstree无法构建子数组,因为仍有待处理的项目需要加载。但我的假设可能是错的。

对于具有简单父级的数组,代码如何才能完美运行,但是当存在多个父级时它会中断?这只是我想的时间,还是可能存在更深层次的问题?

我已阅读this question,但似乎用户最初使用AJAX并解决了声明本地对象的问题。我的本地已经是本地的,它在某些情况下确实有效,所以我不确定是怎么回事。

1 个答案:

答案 0 :(得分:9)

在您的代码中,我发生了这个错误:

{
  id : item.code,
  text : item.name,
  parent : item.parentCode
};

"父"有一个id指向一个不存在的id。如果一个项目没有父项,则需要父项"#"。
所以:

  • 检查父级为null或未定义的项目;
  • 检查父项没有对应父项的项目