ExtJS是否自動垃圾收集組件

Question

想象一下以下情況，我有以下HTML文檔：

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

現在在我的代碼中，我告訴ExtJS在我的占位符中渲染一個面板。

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

稍后，代碼的其他部分決定從DOM中刪除占位符div。

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

在這種情況下，小組之前發生了什么？ 我是否需要手動銷毀它，或者ExtJS是否知道它包含的元素剛剛從DOM中刪除它應該自行銷毀Panel？ 我正在使用ExtJS 4.1。

Answer 1

如果刪除包含元素，ExtJS不會自動銷毀組件。 元素將從DOM中刪除，但面板會保留對它的引用。 請嘗試以下方法：

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

該元素仍然存在，如果您想要，可以再次將其附加到DOM：

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

（旁注：面板保持對其包含元素的引用這一事實也會阻止瀏覽器的垃圾收集器破壞它）

基本上它以相反的方式工作，組件管理其相應的DOM元素，因此當您銷毀組件時，DOM元素也將被刪除。

此外，任何可以包含其他組件的組件（即Ext.container.Container及其所有子類）在銷毀時都會銷毀它們的任何子組件（假設啟用了autoDestroy ，這是默認設置）。

因此，如果要自動銷毀已呈現給某個元素的所有組件，只需將該元素創建為容器即可：

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

ExtJS是否自動垃圾收集組件

問題描述

1 個解決方案

解決方案1
4 已采納 2013-11-22 13:26:53

ExtJS是否自動垃圾收集組件

問題描述

1 個解決方案

解決方案1 4 已采納 2013-11-22 13:26:53

解決方案1
4 已采納 2013-11-22 13:26:53