Extjs TreePanel: Comment puis-je masquer des nœuds par classe ou par attribut?

Question

J'ai un arbre avec des noeuds qui contiennent des tâches.

Les tâches terminées ont un statut d'attribut: 100 et class cls: "done".

Je voudrais créer un bouton pour masquer les tâches terminées.

Quelle fonction va cacher les nœuds dans un arbre par leur identifiant ou leur classe?

{"id":"45", 
"description":"Pay bills", 
"status":"100", 
"cls":"done", 
"uiProvider":"col", 
"leaf":true} 

Answer 1

Essayez de marcher l'arbre à partir de la racine et de test pour l'attribut (s) que vous voulez. Si vous obtenez un coup, cacher le nœud:

tree.getRootNode().cascade(function() { // descends into child nodes 
    if(this.attributes['status'] == 100) { // test this node 
     this.getUI().hide() // hide this node 
    } 
}) 

En fait, vous posé des questions sur le test de la classe "done". Dans ce cas, il suffit de tester si this.attributes['cls'] == 'done' à la place. Je préfère vérifier "status" que "cls" car ce dernier peut être séparé de l'espace et salissant.

Answer 2

Pour ExtJS 6, par exemple, lorsque config lire est faux, cacher le nœud:

hideItemsReadFalse: function() { 
    var me = this, 
     items = me.getReferences().treelistRef.itemMap; 


    for(var i in items){ 
     if(items[i].config.node.data.read == false){ 
      items[i].destroy(); 
     } 
    } 
} 

Racine:

{ 
    "text": "root", 
    "children": [ 
     { 
      "text": "Atualização", 
      "iconCls": "x-fa fa-list", 
      "children": [ 
       { 
        "leaf":true, 
        "text": "Empresas", 
        "module": "empresas", 
        "iconCls": "x-fa fa-building", 
        "read": false 
       }, 
       { 
        "leaf":true, 
        "text": "Produtos", 
        "module": "produtos", 
        "iconCls": "x-fa fa-cubes", 
        "read": true 
       } 
      ] 
     } 
    ] 
}