json - Treestore 为空 - JSON 有效吗？

Question

我的代码看起来像这样，但是商店/树中没有数据。

JSON 存储有效吗？我需要在 JSON 之上添加一个 root 吗？

必须在树面板中定义哪些列？

JSON:

{
   "status" : {
      "status" : 0,
      "msg" : "Ok",
      "protocolversion" : "1.1.json"
   },
   "value" : {
      "name" : "Root",
      "path" : "\/",
      "leaf" : false,
      "children" : [
            {
               "name" : "subfolder1",
               "path" : "\/subfolder1",
               "leaf" : false,
               "children" : []
            },
            {
               "name" : "subfolder2",
               "path" : "\/subfolder2",
               "leaf" : false,
               "children" : []
            },
            {
               "name" : "report1",
               "path" : "\/report1",
               "leaf" : true,
               "children" : []
            }
         ]
   }
}

我的 ExtJs 代码:

型号:

// Model for store
     var oModel = Ext.define('TreeModel', {
        extend: 'Ext.data.Model',
        fields: [
           { name: 'name',         type: 'string' },
           { name: 'path',         type: 'string' }
        ]
     });

商店:

     // Store with local proxy
     var oStore = Ext.create('Ext.data.TreeStore', {
        model: oModel,
        autoLoad: true,
        proxy: {
           type  : 'ajax',
           url   : './data/response.json'
        },
        reader: {
           type  : 'json',
           root  : 'value'
        }
     }); 

树面板:

     // View with TreePanel
     var oTreePanel = Ext.create( 'Ext.tree.Panel', {
        store       : oStore,
        useArrows   : true,
        displayField: 'text',
        rootVisible : true,
        multiSelect : true,
        border      : 0,
        columns     : [
           {
              xtype    : 'treecolumn',
              dataIndex: 'name',
              text     : 'Tree',
              flex     : 3
           },
           {
              dataIndex: 'path',
              text     : 'Path',
              flex     : 2
           }
        ]
     } );

Answer 1

您需要在您的 json 和阅读器的根目录中将 value 更改为 children。

思考的方式是这样的:读者的根告诉读者记录数据从哪里开始。但是因为树数据是嵌套的(一个节点可以有子节点)，ExtJS 在每个节点中寻找另一个根(然后在后一个节点中寻找另一个根，递归地依此类推)。

因此，如果您将阅读器的根称为“children”，它会在具有 children 节点的节点中查找子节点。

您同样可以称其为“subs”或“whatever”；您只需要确保在整个层次结构中使用相同的东西，包括 json 数据的根。