Ext JS_extjs에 하위 컴포넌트 추가에 대한 오해에 대한 토론

사람들은 종종 창이 변경될 때 그리드가 자동으로 조정되지 않는 이유를 묻습니다. 이를 이해한 후에 많은 사람들이 하위 구성 요소를 렌더링할 때 그리드를 컨테이너 내의 div로 렌더링하는 데 익숙하다는 것을 알았는데 바로 여기에 문제가 있습니다.

Ext JS의 레이아웃 시스템에서 제어할 수 있는 것은 컨테이너의 하위 컴포넌트입니다. 그러나 컨테이너에 DIV로 렌더링된 Grid의 경우 Grid가 추가되었는지 알지 못합니다. 크기를 조정할 때 그리드의 크기를 조정할 수 없으므로 컨테이너가 변경될 때 그리드가 변경되지 않습니다.

왜 많은 사람들이 이 방법을 사용하여 하위 구성 요소를 추가하는 것을 좋아합니까? 크게 두 가지 이유가 있다고 생각합니다.
1. 컨테이너에 하위 구성 요소를 추가하는 방법을 모르겠습니다.
2. 다른 프레임워크를 사용하는 개발 방법에 익숙합니다. JQuery와 같은 것이 있어서 한동안 변경할 수 없습니다

첫 번째 이유는 Grid가 동적으로 추가되는 한 많은 초보자가 당황하기 때문입니다. 예를 들어 내 Grid를 먼저 원격에서 반환해야 합니다. 이 스크립트를 어떻게 생성하고 컨테이너에 추가하는지 알고 있습니다. 저자 역시 Ext JS를 배울 때 이런 실수를 저질렀는데, 이는 이해할 수 있는 일입니다. 따라서 이 글의 목적은 혼란을 해소하는 것입니다.

두 가지 방법이 있습니다. 먼저 Ajax를 사용하여 전체 Grid(또는 기타 구성 요소 구성 개체)를 로컬로 로드한 다음 컨테이너의 add 메서드를 사용하여 구성 요소를 하나는 컨테이너의 로드 기능을 직접 사용하여 하위 구성요소를 직접 로드하고 렌더링하는 것입니다.

두 번째 이유는 습관 문제인데, 이는 스스로 고칠 수 있으며, Ext JS 개발 모델에 빨리 익숙해지면 이 습관을 쉽게 바꿀 수 있습니다.

Ext JS 4의 MVC를 사용하여 개발한다면 이런 당황스러운 상황은 기본적으로 발생하지 않습니다. 따라서 하위 컴포넌트를 뷰로 만든 다음 컨트롤러의 컨테이너에 뷰를 추가하면 됩니다.