如何更改dojo樹中葉節點的圖標？

Question

我已經創建了一個樹，其中包含關於服務器及其虛擬機的信息。 我想在虛擬機啓動時將虛擬機的圖標更改爲綠色，如果虛擬機處於關閉狀態，則將虛擬機的圖標更改爲紅色。 如何做到這一點？

Answer 1

根據VM是打開還是關閉，創建一個切換樹節點css類的函數。

ar iconFunc = dojo.hitch(this, function (item, opened) { 
       if(item !== undefined && item !== null) { 
        if (item.VmOn!== undefined) { 
         return "VmOn"; 
        } 
        else { 
         return "VmOff"; 
        } 
       } 
      }); 

當創建你的樹，通過iconFunc在構造PARAMS：

var treeParams = { 
    getIconClass : iconFunc, //attach the custom icon function 
...}; 
var myTree = new dijit.Tree(treeParams); 

然後創建CSS樣式稱爲VMON和VmOff：

.VmOn { 
    background: url(path to your image for VmOn) no-repeat; 

商店項目組成樹節點將需要VmOn或VmOff的屬性或更改iconFunc以不同的方式檢查商店項目...

Answer 2

這可能是做同樣的事情的另一種方式，

getIconStyle:function(item, opened){ 
    if(!item.root){ 
     if(!item.children){ 
      // Style the nodes that not have childrens 
      return {backgroundColor: "red"}; 
     }else{ 
      // Style the nodes that have childrens 
      return {backgroundColor: "blue"}; 
     } 
    }else{ 
     // Style the root node here 
     return {backgroundColor: "orange"}; 
    } 
} 

你也可以使用getIconClass返回相應的CSS類名。