Ext JS ViewController의 lookupReference

  1   ViewController의 lookupReference

---

 Ext Js로 샘플을 만들던 중 이상한 것을 발견했습니다. 뷰 컨트롤러에서 lookupReference 함수를 이용하여 지정된 뷰의 컴포넌트를 가져오는 코드였는데, 오타도 없고 분명 지정된 뷰에있는 reference임에도 불구하고 계속 null값을 던지는상황..

 혹시나 이 뷰가 아닌 다른 뷰를 참조하나 싶어 해당뷰에 한개의 reference를 더 추가하고 테스트 해봤는데..  추가한 reference는 잘도 가져옵니다.

어쨌든 ! 해당 문제가 발생하는 코드는 다음과 같습니다.

코드의 상단에 주석처리한 부분만 보시면 됩니다. 확실히 뷰에서 컨트롤러를 지정하였고, reference도 설정했습니다.

이제 컨트롤러에서는 다음과 같은 방법으로 컴포넌트를 가져옵니다.

그럼 결과는..? 요렇게 나오게 됩니다.

 

  2   View 의 lookupReference() 함수

---

뭐가 문제인지 찾아보니 이런 글을 찾을 수 있었습니다. 우선적으로 제가 잘못한 점은 reference 설정을 뷰의 아이템들이 아닌 뷰 자체에 설정한것이었습니다. 첫번째 reference는 뷰인 Window에 설정하였고, 두번째 reference는 그 Window가 가진 아이템중 하나인 Form에 설정한것이죠.

The view controller has a reference to the view where the controller is specified. That is what getView() returns. Code taken from source linked from API .

Code:

getView: function() {
        return this.view;
    },

The example you refer to is dealing with a grid within the view where the controller is specified (the view is a panel with a grid as one of its items and with the reference specified).

Now, take a look at what the viewcontroller's lookupReference does; it has the view do the lookupReference() :

Code:

    lookupReference: function (key) {
        var view = this.view;
        return view && view.lookupReference(key); 

 위 의 글대로 보면 우선 뷰 컨트롤러의 getView()함수는 자신이 가지고있는 뷰를 리턴하게 됩니다. 물론 getView()함수는 많이 사용해 보았으니 이점은 알고있었죠.

 하지만 lookupReference() 함수를 보면 뷰의 lookupReference() 함수의 리턴값을 리턴하고있습니다. 이제 왜 문제가 되었는지 알수 있습니다. 

 위에서 사용한 컨트롤러의 lookupReference의 인자로 뷰에 설정했던 reference 값들을 던져줄때 이 lookupReference 함수내부에서는 뷰의 lookupReference를 호출하게 되고, 뷰에서는 자신의 items에 존재하는 컴포넌트중 전달된 값의 reference가 존재하는지 확인하게 되는겁니다. 즉 자기 자신의 reference 값이 아닌 items에 선언된 컴포넌트들의 reference만 검색하기때문에 null값이 튀어 나오게 되는거죠.

 어차피 컨트롤러는 지정된 뷰의 참조를 이미 가지고있습니다. 즉 lookupReference() 함수를 통해 뷰 자체를 가져올 필요가 없이 그냥 getView()를 통해 가져오면 되는것이지요. 생각해보면 당연한건데 제딴에는 하나의 함수로 통일하여 일관적으로 코딩하고 싶었기에 lookupReference를 사용한 것이 잘못된거였습니다.. ㅠㅠ