2013-12-11 4 views
3

"renderTo"속성을 통해 div 안에 렌더링되는 Ext.Component가 있습니다. 나는 그것이 렌더링되는 DOM 요소를 제외하고 그 구성 요소에 대한 다른 참조를 가지고 있지 않습니다.div 요소 내에서 Ext 구성 요소 삭제

이제이 요소를 DOM에서 제거하면 문제가 지속되는 요소 (즉, 클래스 "x-mask"가있는 마스크 요소)가 유지된다는 것입니다.

DIV의 모든 Ext.Components를 깨끗하게 정리하고 제거하여 관련 요소가 남지 ​​않도록 할 수 있습니까?

다른 방법으로는 먼저이 div에 렌더링 된 모든 Ext.Components를 찾아 내 자신을 제거하는 것입니다.

답변

4

구성 요소에 대한 참조가 없다면 (id조차도 포함되지 않음) 구성 요소에 속한 DOM 요소의 하위 요소를 검사해야합니다.

예 :

var childNodes = document.getElementById('your-dom-element').childNodes; 
for (var i = childNodes.length-1, cmp; i >= 0; i--) { 
    cmp = Ext.getCmp(childNodes[i].id); 
    if (cmp) { 
     cmp.destroy(); 
    } 
} 

ExtJS로 항상 구성 요소에 대한 id를 제공합니다 (이 당신에 의해 지정되지 않은 경우, 그것은 하나를 생성합니다) 및 DOM 요소를 기본 구성 요소의 id 속성으로 사용 .

따라서 DOM 요소 (직접) 하위 노드를 살펴보고 하위 노드의 ID와 연결된 구성 요소가 있는지 테스트 할 수 있습니다. 하나가 발견되면 destroy을 호출 할 수 있습니다. 그러면 DOM의 구성 요소 (및 모든 하위 구성 요소)가 삭제됩니다.

6

구성 요소 레벨에서 destroy();을 호출하여 구성 요소 자체를 파괴해야합니다. DOM 요소가있는 경우 id에 액세스 할 수 있습니다. 그와 함께

Ext.getCmp('cmpIdValue').destroy(); 

구성 요소가 DOM 요소를 파괴하는주의해야 할 및뿐만 아니라 모든 청취자를 관리 청소합니다.