ExtJs - 如何使用动态参数加载TreeStore

时间:2012-08-10 13:12:24

标签: json extjs tree load store

我的带有treestore的树最初被加载但请求子节点失败。

请求子项时,会传输一个参数localpath,用于定义子数据所在的路径。

初始请求:localpath=/ - >让所有孩子都进入/

儿童请求:localpath=/subfolder1 - >让所有孩子都进入/subfolder1

我附上了两个截图,显示了初始加载并显示文件夹点击的时间。

Folders initially loaded

Folders clicked but no children

顺便说一句:我树上的箭头在哪里?

Json :我的树存储接收如下的json数据:

{
    "value": {
      "name": "",
      "path": "/",
      "leaf": false,
      "type": "folder",
      "children": [
        {
          "name": "subfolder1",
          "path": "/subfolder1",
          "leaf": false,
          "type": "folder",
          "children": []
        },
        {
          "name": "subfolder2",
          "path": "/subfolder2",
          "leaf": false,
          "type": "folder",
          "children": []
        },
        {
          "name": "testreports",
          "path": "/testreports",
          "leaf": false,
          "type": "folder",
          "children": []
        }
      ]
    }
}

商店:树商店看起来像这样:

 var oTreeStore = Ext.create( 'X.module.store.store.Tree', {
    model    : 'X.module.store.model.TreeNode',
    api      : this.httpApi,
    module   : "store",
    func     : "getchildren",
    scope    : "user"
 } );

TreePanel 创建:

 var oTreePanel = Ext.create( 'X.module.store.view.TreePanel', {
    store       : oTreeStore
 } );

TreePanel 定义:

    constructor: function( oConfig ) {

     var self = this;
     //creating a proxy, which can communicate with HTTP-API
     //and is able to parse it's json-tree format

     var oProxy = Ext.create( 'X.lib.httpapiclient.Proxy', {
        api     : oConfig.api,
        module  : oConfig.module,
        func    : oConfig.func,
        params  : {
           scope       : oConfig.scope
        },
        reader  : {
           type: 'json',
           root: function( o ) { return o.value? o.value.children : o.children; }
        },
        delay   : oConfig.delay || 100,
        success : oConfig.success || function() {},
        progress: oConfig.progress || function() {},
        error   : oConfig.error || function() {}
     } );

     oConfig.nodeParam = 'localpath';
     oConfig.proxy = oProxy;

     self.callParent( arguments );

     //the HTTP-API requires the ID of the root-node to be empty
     self.on( 'beforeload', function( s, o ) {
        if( o.params.localpath === 'root' ) o.params.localpath = '/';
     } );


  }

模型:模型......

   Ext.define( 'X.module.store.model.TreeNode', {
      extend: 'Ext.data.Model',
      fields: [
         { name: 'name',         type: 'string' },
         { name: 'path',         type: 'string' },
         { name: 'type',         type: 'string' }
      ]
   } );

1 个答案:

答案 0 :(得分:0)

解决方案是在children属性中提供子项。就我而言,我正在提供像children: []这样的空洞儿童。所以没有什么可以展示的。