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 的情況下提供一個 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