Question

在ExtJs3中，我的团队执行以下操作将数据加载到树库中。在ExtJS4中执行此操作的等效方法是什么？当我使用NodeInterface执行类似的代码时，我得到一个“无法读取属性'0'的null”错误。

Ext.Ajax.request({
            url: servlet,
            success: function(response, opts)
            {
                var jsonData = Ext.decode(response.responseText);

                var root = new Ext.tree.AsyncTreeNode({
                    text: 'Root test',
                    draggable: false,
                    id: 'root',
                    children: jsonData.tree.data
                });
                tree.setRootNode(root);
//...

更新：我真的不在乎如何完成这项工作。我只有两个要求：（1）使用单个服务器请求获取无关的数据。（2）重用不同数据的treepanels和gridpanels

我已经能够将数据加载到动态创建的树状区域中。但是，使用setRootNode（）不适用于现有树面板。

//this works
var tree = Ext.create('Ext.tree.Panel', {
          root: {
                text:'Application',
                expanded:true,
                children: jsonResponse.categoryTree.data
          }
        });

//this doesn't work
existingTree.setRootNode(root);

Answer 1

到目前为止，“足够好”的解决方案是

将树状面板变为类

每次数据更改时：

删除树面板
实例化新的树面板

不是“Ext JS 4”方式，但它完成了工作。除非有人能用正确的做事方式启发我，否则我会将此作为答案。

                var panel = Ext.ComponentQuery.query('panel#categorysearch')[0];

                //destroy the tree panel
                panel.remove('categorysearchtree', true);

                //create a new one
                var tree = Ext.create('MyApp.view.CategorySearchTreePanel', {
                    root: {
                        text:'Services', 
                        expanded:true,
                        children: jsonResponse.categoryTree.data
                    }
                });

                panel.add(tree);

手动/动态地将数据加载到treepanel中？

1 个答案: