Javascript ExtJS加载嵌套JSON

我有嵌套的json文件。我用它来装树面板。问题是：当我加载树时，它会加载整个json文件

{
"success": true,
"data": [{
    "id": "A",
    "name": "Parent",
    "data": [{
        "id": "Aa",
        "name": "Child",
        "data": [{
            "id": "Aaa",
            "name": "Grandchild",
            "data": [{
                "id": "Aaaa",
                "name": "Grandgrandchild",
                "leaf": true,

             }]
        }]
    }]
}]
}

所以当我加载树时，所有的存储都被加载，当我展开文件夹时，什么都不会加载。 我希望它以不同的方式工作。我的意思是当我加载树面板时，只有第一级存储加载，在本例中，只有父级应该加载，当我展开父文件夹时，存储加载子级，当我展开子文件夹时，它加载孙子文件夹。我需要这个，因为我有一个非常大的嵌套json文件，我不能立即将其加载满

以下是我的店铺：

Ext.define('Values.store.ThisStore', {
extend: 'Ext.data.TreeStore',
model: 'Values.model.Item',

proxy: {
    type: 'rest',
    format: 'json',
    url: 'data/vg1',
    reader: {
        type: 'json',
        root: 'data'
    }
}

})

我知道这应该很简单，但我不知道怎么做。 期待答案，提前感谢

更新

我解决了这个问题，正如我所说，它非常简单。无论如何，谢谢你。其主要思想是将一个大json拆分为几个小json。我将展示：

大json看起来是：

{
"success": true,
"data": [{
    "id": "A",
    "name": "Parent",
    "data": [{
        "id": "Aa",
        "name": "Child",
        "data": [{
            "id": "Aaa",
            "name": "Grandchild",
            "data": [{
                "id": "Aaaa",
                "name": "Grandgrandchild",
                "leaf": true,

             }]
        }]
    }]
}]
}

它会立即加载整个文件。但如果按这种方式拆分：

root.json

{
    "success": true,
    "data": [{
        "id": "A",
        "name": "Parent"
    }]
}

A.json

{
   "success":true,
    "data": [{
        "id": "Aa",
         "name": "Child",
    }]
}

Aa.json

{
    "success":true,
    "data": [{
        "id": "Aaa",
         "name": "GrandChild",
    }]
}

Aaa.json

{
    "success":true,
    "data": [{
        "id": "Aaaa",
         "name": "GrandgrandChild",
         "leaf": true
    }]
}

---

一切都很好！希望这个问题的解决方案也能帮助其他人，因为我花了一段时间才解决它

我用下面的代码在try.sencha中使用了您的JSON。 它正在按照您的要求工作。下面是代码。JSOn是您的JSOn数据。请检查下面的内容

Ext.require([
    'Ext.data.*',
    'Ext.grid.*',
    'Ext.tree.*'
]);

Ext.onReady(function() {


    var store = Ext.create('Ext.data.TreeStore', {
        fields:['id','name'],
        proxy: {
            type: 'ajax',
            //the store will get the content from the .json file
            url: 'treegrid.json',
         reader: {
            type: 'json',
            root: 'data'
    }
        }
         });


    var tree = Ext.create('Ext.tree.Panel', {
        title: 'Core Team Projects',
        width: 500,
        height: 300,
        renderTo: Ext.getBody(),
        collapsible: true,
        rootVisible: false,
        store: store,
        singleExpand: true,

        columns: [{
          text: 'Id',
            flex: 1,
            dataIndex: 'id',
            sortable: true
            },{
          text: 'Name',
            flex: 1,
            dataIndex: 'name',
            sortable: true
        }]
     });
});

---

谢谢你的回答，但这篇文章对我帮助不大。我之前看到过，这个人试图解决一个稍微不同的问题。还在等待答案！更新了我的答案。请验证。我用sencha fiddle中的Json尝试了你的代码，它的工作原理与我的类似。加载网格时，整个存储也会加载。当我展开文件夹时，没有加载任何数据，因为所有内容都已加载。这个json文件没有问题，但如果json将有数千个孩子，计算机将冻结相当长的时间。我需要类似于这个例子的东西，除了这是xml，我需要Json，但主要思想是一样的。