국경 레이아웃 센차의 API에서 경계 배치

Question

의 다른 지역에 액세스은 말한다 :

내가 여러 블로그에 발견하는 내용의 ExtJS 4.0 이상

에는 BorderLayout.Region 클래스가 없다,

이 문서에 다시

var viewPort = Ext.ComponentQuery.query('viewport')[0]; 
var centerR = viewPort.layout.centerRegion; 

, 내가 centerRegion 개인 기능 (왜?), 나는 그에서 F를 의존하는 상관 없어 것을 볼 : 액세스하기위한 중앙 패널이 있었다 또는 미래의 교정. 또한 westRegion, northRegion 등은 없습니다.

어떻게 이러한 항목에 접근 할 수 있습니까?
물론 다양한 영역의 패널을 사용할 수는 있지만 테두리 레이아웃을 유지하는 뷰포트를 완벽하게 제어해야합니다. 이것은 내가 지금 뭘하는지입니다 : 더 좋은 방법이

var viewPort = Ext.ComponentQuery.query('viewport')[0]; 
    var view = Ext.widget('my-new-tab-panel'); 

    viewPort.layout.centerRegion.removeAll(); 
    viewPort.layout.centerRegion.add(view); 

있습니까?

Answer 1

일반적으로 작업해야하는 각 컨테이너의 ID를 설정합니다. 그래서, 내 센터 지역은 ID가있을 것이고 Ext.getCmp() 기능을 사용하게 될 것입니다. 다음과 같이

그렇지 않으면, 당신이 할 수있는 뷰포트 항목에 액세스 할 수 :

var viewPort = Ext.ComponentQuery.query('viewport')[0]; 
var view = Ext.widget('my-new-tab-panel'); 

viewPort.items.items[0].removeAll(); 
viewPort.items.items[0].add(view); 

를 당신이 뷰포트의 첫 번째 항목으로 중심 영역을 정의한 경우, 위의 코드 괜찮아요하지만 한 경우 세 번째 또는 네 번째로 정의 된 경우 해당 지역의 위치 (viewPort.items [3] 또는 viewPort.items [4] 등)에 따라 색인을 변경해야합니다.

또 다른 방법은 쿼리 선택기를 사용하는 것입니다

이

var cr = viewPort.down('panel[region=center]'); 
cr.removeAll(); 
cr.add(view); 

그러나,이 방법은 다음, 당신이 (이 경우 패널)을 정확하게 위해 xtype에 조회 할 수 있습니다.

어쨌든 가장 좋은 방법은 각 지역마다 ID를 사용하는 것입니다.