이미지 바꾸기?

Question

아래 코드는 트리 구조를 표시합니다. 이미지 Pic.gif를 클릭하면 새 이미지로 바뀌어야합니다. 마찬가지로 이미지 pic1.gif가 새 이미지로 바뀌고 pic6.gif가 새 이미지로 바뀝니다. 코드를 사용하면 도움이 될 수 있습니까? 정확히이 코드에 맞습니까?

var children = [{ 
    text: 'family', 
    icon: 'pic1.gif', 
    children: [{ 
     text: 'parent1', 
     icon: 'pic2.gif', 
     children: [{ 
      icon: 'pic3.gif', 
      text: 'children1', 
      leaf: true}, 
     { 
      icon: 'pic4.gif', 
      text: 'children2', 
      leaf: true}, 
     { 
      icon: 'pic5.gif', 
      text: 'children3', 
      leaf: true}]}], 

    }, 
{ 
    text: 'Parent2', 
    icon: 'pic6.gif', 
    children: [{ 
     icon: 'pic7.gif', 
     text: 'children4', 
     leaf: true}, 
    { 
     icon: 'pic8.gif', 
     text: 'children5', 
     leaf: true}, 
    { 
     icon: 'pic9.gif', 
     text: "children6", 
     leaf: true}]}]; 
Ext.onReady(function() { 
    var tree = new Ext.tree.TreePanel({ 
     loader: new Ext.tree.TreeLoader(), 
     width: 1000, 
     height: 1000, 
     renderTo: Ext.getBody(), 
     root: new Ext.tree.AsyncTreeNode({ 
      expanded: false, 
      leaf: false, 
      icon: 'pic.gif' 

      , 
      text: 'Head', 
      children: children 
     }) 
    }); 
}); 

Answer 1

당신은 노드가 beforeexpand 리스너를 사용하여 확장 될 때 아이콘 변경을 트리거해야합니다 당신은 또한 다른 노드가를 반복 할 수

var children = [{ 
    text: 'family', 
    icon: 'pic1.gif', 
    listeners: { 
     'beforeexpand': function(node) { 
      node.setIcon('newImage.gif'); 
     } 
    } 
    children: [{ 
    //... 

.