跟我extjs5(03--在项目过程中加载文件)


上一节中用sencha工具自己主动创建了一个项目。而且能够在浏览器中查看。

如今我们来看看js类载入过程。

例如以下图所看到的:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvamZvaw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

1、首先:浏览器中输入 localhost:1841 ,调用 index.html;
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8"> <title>app</title> <!-- The line below must be kept intact for Sencha Cmd to build your application -->
<script id="microloader" type="text/javascript" src="bootstrap.js"></script> </head>
<body></body>
</html>

在这里面仅仅引入了一个文件:bootstrap.js。这是一个奇妙的文件,他依据配置文件bootstrap.json来设置extjs的类的调用路径、引入css,最后再依据配置文件里的信息,载入app.js。

这个文件仅仅要知道这些功能即可了,要了解详细的内部实现,能够去搜索一下相关文章。

2、app.js文件的说明

Ext.application({
name: 'app',//应用的名称app extend: 'app.Application', //继承自app.Application,这个文件是 app/Application.js autoCreateViewport: 'app.view.main.Main' //自己主动创建的Viewport的类名,文件在 app/view/main/Main.js });

上面的类中会依据类载入的设置信息,自己主动为类 app.Application载入文件 /app/Application.js,相同也为app.view.main.Main类找到js文件并载入。

3、Application.js文件

Ext.define('app.Application', {
extend : 'Ext.app.Application', name : 'app',
views : [], // MVC用到的view
controllers : ['Root'
// MVC控制器的名称,会自己主动到 /app/controller下去载入同名的js文件
// 对于Root,会去自己主动载入 /app/Controller/Root.js 这个文件
],
stores : [],
launch : function() {
// 须要运行的语句能够加在此处
}
});

4、Main.js 文件

Ext.define('app.view.main.Main', {
extend: 'Ext.container.Container', xtype: 'app-main', controller: 'main',
//MVVM架构的控制器的名称,会在当前路径中依据‘Main’ + Controller 来确定文件名称
//这个我没找到其它不论什么能够自己主动载入MainController.js的依据,仅仅能作上面的推断了
viewModel: {
type: 'main'
//MVVM架构的viewModel的类型,会在当前路径中依据‘Main’ + Model 来确定文件名称
}, layout: {
type: 'border' //系统的主页面的布局
}, items: [{
xtype: 'panel',
bind: {
title: '{name}'
},
region: 'west', //左边面板
html: '<ul><li>This area is commonly used for navigation, for example, using a "tree" component.</li></ul>',
width: 250,
split: true,
tbar: [{
text: 'Button',
handler: 'onClickButton'
}]
},{
region: 'center', //中间面版
xtype: 'tabpanel',
items:[{
title: 'Tab 1',
html: '<h2>Content appropriate for the current navigation.</h2>'
}]
}]
});

上面的类是继承自Container的一个容器类,这个类使用了extjs5的mvvm的新特性,

    controller: 'main',
//MVVM架构的控制器的名称,会在当前路径中依据‘Main’ + Controller 来确定文件名称
//这个我没找到其它不论什么能够自己主动载入MainController.js的依据。仅仅能作上面的推断了
viewModel: {
type: 'main'
//MVVM架构的viewModel的类型,会在当前路径中依据‘Main’ + Model 来确定文件名称
},

上面的属性controller表示当前Main类的控制器为"main",这个类里没有引用控制器的语句。因此控制器的类名可能是有其默认的载入规则。应该是在当前路径中载入“Main”+"Controller.js",这个文件作为控制器。

viewModel属性定义了VM的类型,其载入类的规则和上面控制器是一样的。

因为此类是作为一个 autoCreateViewport 属性被载入,载入完毕后会马上生成一个实例,并渲染,就是我们看到的网页。

extjs中类的动态载入机制非常灵活,这里也不能所有讲到,有不明确的能够查找相关资料。在用sencha cmd 对js 进行编译以后,会将所有的js ,书面和包含用户手册extjs5 sdk用类都在同一个文件。当它目前只发行了一大js文件。

跟我extjs5(03--在项目过程中加载文件)的更多相关文章

  1. vs2012运行项目报未能加载文件或程序集“System.Web.Mvc, Version=4.0.0.1,Culture=neutral”问题和解决方法

    原先本地项目版本(4.0.0.1)高于服务器版本(4.0.0.0),本地项目改成服务器版本4.0.0.0时,发布后的项目报这个错误

  2. Bug,项目过程中的重要数据

    作者|孙敏 为什么要做Bug分析? Bug是项目过程中的一个有价值的虫子,它不只是给开发的,而是开给整个项目组的. 通过Bug我们能获得什么? 积累测试方法,增强QA的测试能力,提升产品质量 发现项目 ...

  3. VS2017 MVC项目,新建控制器提示未能加载文件或程序集“Dapper.Contrib解决方法

    VS2017中MVC项目中,右键新建控制器时,提示 未能加载文件或程序集“Dapper.Contrib, Version=1.50.0.0, Culture=neutral, PublicKeyTok ...

  4. “System.BadImageFormatException”类型的未经处理的异常在 PurchaseDevices.Access.dll 中发生 其他信息: 未能加载文件或程序集“System.Data.SQLite, Version=1.0.66.0, Culture=neutral, PublicKeyToken=db937bc2d44ff139”或它的某一个依赖项。试图加载格式不正确

    引用sqlite的程序集时,有时会报如下异常:  "System.BadImageFormatException"类型的未经处理的异常在 PurchaseDevices.Acces ...

  5. MVC开发中的常见错误-01未能加载文件或程序集“EntityFramework, Version=6.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089”或它的某一个依赖项。

    错误信息:未能加载文件或程序集“EntityFramework, Version=6.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089”或 ...

  6. vs2015 项目调试出现未能加载文件或程序集“Antlr3.Runtime”或它的某一个依赖项。找到的程序集清单定义与程序集引用不匹配。 (异常来自 HRESULT:0x80131040)

    今天在调试项目不知道怎么了,突然就报未能加载文件或程序集“Antlr3.Runtime”或它的某一个依赖项.找到的程序集清单定义与程序集引用不匹配. (异常来自 HRESULT:0x80131040) ...

  7. MyBatis Java不同方式加载文件时的路径格式问题、Mybatis中加载.properties文件

    public class LoadPropTest { public static void main(String[] args) throws IOException { //一.Properti ...

  8. 无法加载文件 **.ps1,系统中禁止执行脚本

    控制台执行命令后出现 无法加载文件 ******.ps1,因为在此系统中禁止执行脚本.有关详细信息,请参阅 "get-help about_signing" 在控制台执行命令: s ...

  9. SAP HANA项目过程中优化分析以及可行性验证

    在项目开发过程中,经常会遇到HANA模型运行效率的问题: 以我们项目为例,HANA平台要求模型运行时间不能超过10秒,但是在大数量和计算逻辑复杂的情况下(例如:ERP中的BKPF和BSEG量表的年数据 ...

随机推荐

  1. UIImagePickerController本地化控件文字

    在使用UIImagePickerController时候,你会发如今选择照片或者拍照的时候,界面的很多控件都是英文的,比方"Cancel","Choose"等. ...

  2. Android中Menu的基本使用方法

    一. 使用xml定义Menu 菜单资源文件必须放在res/menu文件夹中.菜单资源文件必须使用<menu>标签作为根节点.除了<menu>标签外,还有另外两个标签用于设置菜单 ...

  3. UltraEdit破解方法最强收录

    作为一个能够满足你一切编辑需求的强大文本编辑器.ultraedit在IT届有着非常高的人气.只是它正版的价钱也是不廉价滴,没记错的话是要好几十刀. 那么对于我们来说,破解UltraEdit就是一项必备 ...

  4. (1)cocos2d-x-2.2.4搭建windows开发环境

    Cocos2d-x-2.2.4搭建windows环境 软件需求 Windows系统(windows7或之后的系统): cocos2d-x-2.2.4压缩包. python安装包(推荐使用2.7.3版本 ...

  5. 重温委托(delegate)和事件(event)

    1.delegate是什么 某种意义上来讲,你可以把delegate理解成C语言中的函数指针,它允许你传递一个类A的方法m给另一个类B的对象,使得类B的对象能够调用这个方法m,说白了就是可以把方法当作 ...

  6. hdu3732(多重背包)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3732 题意:Ahui学习英语单词,每个单词都是不同的,并且都有自身的价值量 w 和难度值 c (0&l ...

  7. Xenu-web开发死链接检測工具应用

    Xenu 是一款深受业界好评,并被广泛使用的死链接检測工具. 时常检測站点并排除死链接,对站点的SEO 很重要,由于大量死链接存在会减少用户和搜索引擎对站点的信任,web程序开发者还可通过其找到死链接 ...

  8. HDU3537-Daizhenyang&#39;s Coin(博弈SG-打表)

    <span style="color: green; font-family: Arial; font-size: 12px; background-color: rgb(255, 2 ...

  9. JS 在 HTML 无缝滚动

    marquee图片无缝滚动先了解一下对象的几个的属性:innerHTML: 设置或获取位于对象起始和结束标签内的 HTMLscrollHeight: 获取对象的滚动高度.scrollLeft: 设置或 ...

  10. Scroll View 控件以Thumbnail的方式显示一个目录的全部图片,相似图片浏览器

    MAC : XCode -> Scroll View 控件以Thumbnail的方式显示一个目录的全部图片,类似图片浏览器 STEP1:将两个目录复制到project里面ImageBrowser ...