Extjs4 动态加载(Ext.Loader)

关于extjs4的动态加载Ext.loader，查到两篇文章，有一些不同的地方，留下备用。

一、

项目文件路径图

 

Js代码  

1. Ext.Loader.setConfig({  
2.    enabled: true,  
3.    paths : {//'类名前缀':'所在路径'  
4.       'App.ux' : 'lib'  
5.    }  
6. });  
7. //或者用setPath设置匹配路径  
8. //Ext.Loader.setPath('App.ux', 'lib');//'类名前缀','所在路径'  
9. Ext.require(['App.ux.MusicWin']);//通过匹配会自动加载'lib/MusicWin.js'  

注意Ext.require里面是类名或者别名什么的。

 

MusicWin.js代码：

Js代码  

1. Ext.define('App.ux.MusicWin',{  
2.     play : function(){  
3.         alert('playing...');  
4.     }  
5. });  

 

 

浏览器监听结果：

 

 

项目文件路径图：

二、

1. 命名空间问题，为了让浏览器不加载多余的js文件，导致浪费占用宽带流量，所以使用以下ext4中的方法，以致当需要使用该js文件时才进行加载。如下：


（a）(function (){
Ext.Loader.setConfig({
enabled:true,
paths:{
myapp:"myux"  设置时注意，此为js组件的路径。
}
});
Ext.onReady(function(){}……

(b) Ext.define("myux.mywinux",{……  定义组件时，要带上空间名。

(c) Ext.create("myux.mywinux",{ }).show(); 调用组件时，也要带上空间名，否则出以下错误：（注意：mywinux是匹配js组件文件的名字）