0

我试图在选择非根节点时动态地将子树节点添加到它。

这就是我实现它的方式：

首先，我用 TreeStore 填充我的树，然后动态添加子树节点，我在树控制器中的 itemexpand 事件上处理它。

//pThis is a NodeInterface obj of the selected node
itemexpand: function (pThis, pEOpts) {
      //type is an attribute that I added so that I know what type of node that got selected
      if (pThis.raw.type === 'Staff' && !pThis.hasChildNodes()) {
                    var staffNodeAry = [{text:"Teachers", type:"ChildStaff", leaf: false},
                                                     {text:"Principals", type:"ChildStaff", leaf: false}];          
                     pThis.appendChild(staffNodeAry); 
       }
}

这工作得很好，因为我能够在“员工”类型下看到“教师”和“校长”节点，但到目前为止我发现了 2 个问题：

1）控制台上有这个错误：

未捕获的类型错误：无法读取未定义的属性“internalId”

我不知道为什么，但如果有人能启发，那就太好了。

2) 当我展开“Teachers”和“Principals”时，itemexpand 返回的 NodeInterface obj 有一个未定义的原始对象。

所以我不能这样做：pThis.raw.type

据我了解，我不需要创建一个新的 TreeStore 来添加任何新的子节点，我认为通过创建一个遵守 NodeInterface 的对象数组就足够了，但我可能错了。如果有人能指出我正确的方向，那就太好了。

汉地

更多信息：

我所做的实际上是遵循 ExtJs 4 文档，所以我相信这是 ExtJs 4 框架上的一个错误。

我还用 Extjs-4.1.0-rc3 对此进行了测试，它也产生了同样的错误。

4

3 回答 3

1

.appendChild() 函数的文档说：

node : Ext.data.NodeInterface/Ext.data.NodeInterface[]
The node or Array of nodes to append

您正在尝试附加 2 个对象的数组，但它们不是“NodeInterface”实例。所以你应该像这样正确地创建它们：

var nodeToAppend1 = pThis.createNode({text:"Teachers", type:"ChildStaff", leaf: false});
pThis.appendChild(nodeToAppend1);

我记得一年前犯了同样的错误，所以我希望这会有所帮助。

于 2012-10-18T08:15:42.847 回答
1

I have resolved this issue changing the event itemexpand with the event afteritemexpand. I have no documentation to justify this. The debugger says to me that the view listen for the itemexpand event and do something that goes wrong if add a node manually...

For the question number 2: you have no raw object because it is created by the reader of the store after the load operation. So if you add a node by hand the raw object does not exists.

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Model-property-raw

于 2012-10-09T17:09:22.993 回答
0

我认为这是因为您的 Ext.TreePanel 异步工作。所以添加过程是：

  1. 附加子节点，将虚拟子叶添加到您的树中，角落带有红色标记
  2. 调用 store 的 create api
  3. 接收响应，如果success=true，用virtual改变

更改的目标是设置 internakId 属性，因此您只能在更改发生后添加新的孩子。我认为更好的是编写一些递归函数并将其绑定到商店添加的事件

 tree.getStore().on('update', addChild);

或者

tree.getStore().load({
  success: function() { 
     addChild()
  });
于 2012-04-19T06:23:00.153 回答