- Sencha Touch 教程
- Sencha Touch - 首页
- Sencha Touch - 概述
- Sencha Touch - 环境
- Sencha Touch - 命名规范
- Sencha Touch - 架构
- Sencha Touch - MVC 解释
- Sencha Touch - 第一个应用
- Sencha Touch - 构建应用程序
- Sencha Touch - 迁移步骤
- Sencha Touch - 核心概念
- Sencha Touch - 数据
- Sencha Touch - 主题
- Sencha Touch - 设备配置文件
- Sencha Touch - 依赖项
- 环境检测
- Sencha Touch - 事件
- Sencha Touch - 布局
- Sencha Touch - 历史与支持
- Sencha Touch - 上传与下载
- Sencha Touch - 视图组件
- Sencha Touch - 打包
- Sencha Touch - 最佳实践
- Sencha Touch 有用资源
- Sencha Touch - 快速指南
- Sencha Touch - 有用资源
- Sencha Touch - 讨论
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
广告