Does ExtJS automaticamente spazzatura raccogliere componenti

immaginare il caso seguente, dove ho il seguente documento HTML:Does ExtJS automaticamente spazzatura raccogliere componenti

<html> 
    <head>... include all the js and css here...</head> 
    <body> 
     <div class="placeholderForExtPanel"></div> 
    </body> 
</html>

Ora da qualche parte nel mio codice, dico ExtJS di rendere un pannello nel mio segnaposto.

var container = Ext.select('.placeholderForExtPanel'); 
Ext.create('Ext.form.Panel', { 
    title: 'My Panel' 
});

Un po 'più tardi, qualche altra parte del codice decide di rimuovere il div segnaposto dal DOM.

Ext.select('.placeholderForExtPanel').first().remove();

In questo caso, cosa succede al pannello che è stato dichiarato prima? Devo distruggerlo manualmente, o ExtJS sa che l'elemento contenente è stato appena rimosso dal DOM e dovrebbe distruggere il Pannello da solo? Sto usando ExtJS 4.1.

fonte

2013-11-22 LordOfThePigs

ExtJS non distruggerà automaticamente i componenti se si rimuove l'elemento che lo contiene. L'elemento verrà rimosso dal DOM, ma il pannello mantiene il suo riferimento ad esso. Provare quanto segue:

Ext.select('.placeholderForExtPanel').first().remove(); 
console.log(Ext.getCmp('panel-id').getEl().dom.parentNode); // assuming your panel's id is "panel-id"

L'elemento esiste ancora, e si può solo aggiungere al DOM di nuovo se si voleva:

document.body.appendChild(Ext.getCmp('panel-id').getEl().dom.parentNode);

(Nota a margine: il fatto che il pannello mantiene il riferimento al suo elemento di contenimento impedisce anche al garbage collector del browser di distruggerlo)

Fondamentalmente funziona in senso inverso, il componente gestisce i suoi corrispondenti elementi DOM, quindi quando si distrugge il componente verranno rimossi anche gli elementi DOM.

Inoltre, qualsiasi componente che può contenere altri componenti (ad esempio Ext.container.Container e tutte le sue sottoclassi) distruggerà qualsiasi componente figlio quando vengono distrutti (supponendo che autoDestroy sia attivato, che è l'impostazione predefinita).

Quindi, se si vuole distruggere automaticamente tutti i componenti che sono stati resi a un certo elemento, basta creare quell'elemento come un contenitore e si dovrebbe essere buono:

var container = Ext.create('Ext.container.Container', { 
    cls: 'placeholderForExtPanel', 
    renderTo: Ext.getBody(), 
    items: [{ 
     xtype: 'panel', 
     title: 'mypanel' 
    }] 
}); 

container.destroy(); // destroys the container AND the panel

fonte

2013-11-22 13:26:53 matt

In realtà, la Reson sto chiedendo è perché voglio avere un ext.tree.Panel organizzato come TreeGrid che consente a determinate righe di eseguire il rendering di componenti arbitrari all'interno del loro associato ''. Ciò significa che sto istanziando i componenti e li renderò a quello '' non preventivamente, la griglia Tree non sembra inviare eventi quando decide che è necessario aggiungere o rimuovere quelli '' dal '

', che mi impedisce di catturare questo evento e distruggere il componente. Quindi speravo che le cose accadessero automaticamente. Hai un'idea di cosa potrei fare? – LordOfThePigs

Ho provato a utilizzare la funzionalità RowBody o il plug-in RowExpander, ma entrambi sono irrimediabilmente bacati da una griglia ad albero. – LordOfThePigs

È possibile ascoltare l'evento [refresh] (http://docs-origin.sencha.com/extjs/4.1.1/#!/api/Ext.tree.View-event-refresh) nella vista, in quanto verrà attivato ogni volta che la vista griglia ricostruisce la struttura HTML. Per quello che vale, il rendering dei componenti su righe o celle di griglia è di solito una cattiva idea (ci sono stato anche io :)) poiché la vista può aggiornarsi frequentemente (ad esempio sull'ordinamento) e potenzialmente molti componenti devono essere renderizzati, il che rallentare significativamente le prestazioni. – matt

Problemi correlati

Does ExtJS automaticamente spazzatura raccogliere componenti

risposta

Problemi correlati