Sencha Touch - Dépendances

Il existe certaines méthodes définies dans Sencha Touch pour déclarer des dépendances, l'une dans l'application et l'autre dans les classes.

Jetons un coup d'œil aux différentes façons de définir les dépendances.

Dépendances au niveau de l'application

Ici, nous déclarons toutes les dépendances lorsque nous créons Ext.application.

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

Désormais, lorsque l'application est chargée, toutes les dépendances seront chargées en même temps. Le chemin des autres fichiers sera -

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

La méthode de déclaration ci-dessus ne charge pas seulement le fichier, elle décide également du profil à conserver comme actif. Après avoir chargé le contrôleur, il s'assure de l'instancier. Une fois les magasins chargés, il les instancie et fournit un identifiant s'il n'est pas déjà donné.

Dépendances spécifiques au profil

Lorsque nous utilisons des profils dans une application, il se peut que peu de fonctionnalités ne soient requises que pour un profil spécifique.

Les dépendances spécifiques au profil sont déclarées dans les profils eux-mêmes au lieu de la déclaration au niveau de l'application.

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

Les dépendances sont chargées indépendamment du profil actif ou non. Cependant, en fonction du profil actif, un traitement supplémentaire tel que l'instanciation du contrôleur et des magasins se produit.

Dépendances imbriquées

Lorsque nous avons une application plus grande, nous avons plusieurs contrôleurs, modèles, vues et magasins.

Il est toujours bon de conserver la modularité dans les applications plus importantes. Pour cela, nous pouvons définir des sous-dossiers et lors de la déclaration des dépendances, nous pouvons utiliser le nom du sous-dossier pour déclarer.

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

Dans le cas ci-dessus, les fichiers suivants seront chargés -

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

Dépendances externes

Nous pouvons spécifier les dépendances en dehors de l'application en donnant des noms complets des classes comme -

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

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

Dans le cas ci-dessus, les fichiers suivants seront chargés -

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