에 extjs 내가이 구조체가 클래스

Question

에 Ext.onReady 함수를 호출 본문에서 창을 닫을 수있는 Example.Form 클래스의 클래스입니다. (성공 결과가 제출되고 열리는 창문이 닫히는 경우)

나쁜 영어로 사과드립니다.

Answer 1

코드 구조는 xtypes로 등록 할 구성 요소를 저장할 위치를 허용해야합니다. 또한 앱을 구성하는 구성 요소의 최상위 네임 스페이스가 있어야합니다. 이렇게하면 항상 앱의 일부를 참조 할 수 있습니다. 컨트롤러 논리를 분해하는 것도 좋은 생각입니다. 작은 응용 프로그램의 경우 단일 제어기가 제대로 작동하지만 응용 프로그램이 커지면 각 제어기마다 하나씩 많은 제어기가있는 것이 좋습니다.

다음은이 예제에서 입력 한 코드의 수정 된 버전입니다. 성공 이벤트를 처리하고 위에서 언급 한 권장 사항에 맞게 구성됩니다.

Ext.ns('Example'); 
    /* store components to be used by app */ 
    Ext.ns('Example.lib'); 
    /* store instances of app components */ 
    Ext.ns('Example.app'); 

    Example.lib.Form = Ext.extend(Ext.form.FormPanel, { 
    // other element 

    // moved to app controller 
    //onSuccess:function(form, action) { 
    //} 

    }); 

    Ext.reg('exampleform', Example.lib.Form); 

    Example.lib.FormWindow = Ext.extend(Ext.Window,{ 
     initComponent: function(){ 
      /* add the items */ 
      this.items ={itemId:'add', xtype:'exampleform'}; 

      /* ext js requires this call for the framework to work */ 
      Example.lib.FormWindow.superclass.initComponent.apply(this, arguments); 
     } 
    }); 

    Ext.reg('exampleformwin', Example.lib.FormWindow); 

    /* 
     manage/control the app 
    */ 
    Example.app.appController = { 
     initApp: function(){ 
      Example.app.FormWindow = Ext.create({xtype:'exampleformwin', id:'formloadsubmit-win'}); 
      Example.app.FormWindow.show(); 

      /* get a reference to the 'add' form based on that item id and bind to the event */ 
      Example.app.FormWindow.get('add').on('success', this.onAddFormSuccess, this); 

     }, 

     /* the logic to handle the add-form's sucess event */ 
     onAddFormSuccess: function(){ 
      Example.app.FormWindow.hide(); 
     } 

    } 

    Ext.onReady(function() { 
     /* start the app */ 
     Example.app.appController.initApp() 
    })