Sencha Touch-종속성

Sencha Touch에는 종속성을 선언하는 특정 방법이 있습니다. 하나는 애플리케이션 내에서 다른 하나는 클래스 내에서 선언합니다.

종속성을 정의하는 다양한 방법을 살펴 보겠습니다.

응용 프로그램 수준 종속성

여기에서 Ext.application을 만들 때 모든 종속성을 선언합니다.

Ext.application({
   name: 'MyApp',
   views: ['StudentsView'],
   models: ['StudentsModel'],
   controllers: ['StudentsController'],
   stores: ['StudentsStore'],
   profiles: ['Phone', 'Tablet']
});

이제 애플리케이션이로드되면 모든 종속성이 동시에로드됩니다. 다른 파일의 경로는-

  • MyApp.views.StudentsView
  • MyApp.models.StudentsModel
  • MyApp.stores.StudentsStore 등

위의 선언 방법은 파일을로드 할뿐만 아니라 활성 상태로 유지할 프로필도 결정합니다. 컨트롤러를로드 한 후 인스턴스화합니다. 상점이로드되면 인스턴스화하고 아직 제공되지 않은 경우 하나의 ID를 제공합니다.

프로필 별 종속성

응용 프로그램에서 프로필을 사용할 때 특정 프로필에만 필요한 기능이 거의 없을 수 있습니다.

프로필 특정 종속성은 응용 프로그램 수준 선언 대신 프로필 자체에서 선언됩니다.

Ext.define('MyApp.profile.Tablet', {
   extend: 'Ext.app.Profile', config: {
      views: ['StudentView'], controllers: ['StudentController'], models: ['StudentModel']
   }
});

프로파일이 활성화되었는지 여부에 관계없이 종속성이로드됩니다. 그러나 활성 프로필을 기반으로 컨트롤러 및 저장소 인스턴스화와 같은 추가 처리가 발생합니다.

중첩 된 종속성

더 큰 응용 프로그램이 있으면 여러 컨트롤러, 모델,보기 및 저장소가 있습니다.

더 큰 애플리케이션에서 모듈성을 유지하는 것은 항상 좋습니다. 이를 위해 하위 폴더를 정의 할 수 있으며 종속성을 선언하는 동안 하위 폴더 이름을 사용하여 선언 할 수 있습니다.

Ext.application({
   name: 'MyApp',
   controllers: ['Controller', 'nested.NewController'],
   views: ['class.Cview', 'SView']
});

위의 경우 다음 파일이로드됩니다.

  • MyApp.controllers.Controller
  • MyApp.controllers.nested.NewController
  • MyApp.Views.Sview
  • MyApp.Views.class.Cview

외부 종속성

클래스의 정규화 된 이름을 다음과 같이 지정하여 응용 프로그램 외부의 종속성을 지정할 수 있습니다.

Ext.Loader.setPath({
   'Class': 'Class'
});

Ext.application({
   views: ['Class.view.LoginForm', 'Welcome'],
   controllers: ['Class.controller.Sessions', 'Main'],
   models: ['Class.model.User']
});

위의 경우 다음 파일이로드됩니다.

  • Class/view/LoginForm.js
  • Class/controller/Sessions.js
  • Class/model/User.js
  • app/view/Welcome.js
  • app/controller/Main.js