ExtJS4的requires是新增的機制,主要是實現異步加載機制。這樣在不點擊對應的按鈕或者選項的時候就不會加載對應的js文件,提高了加載速度和用戶等待時間。 
requires機制的實現通過一個Ext.Loader.setConfig函數來設置文件尋找的映射目錄,然后在需要用到對應js文件的時候使用Ext.require進行加載。 
文件的存儲結構如下所示: 
復制代碼 代碼如下:
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=GBK"> 
<title>extjs4 desktop</title> 
<!-- css --> 
<link type="text/css" href="../../extjs4/resources/css/ext-all.css" /> 
<script type="text/javascript" src="../../extjs4/bootstrap.js"></script> 
<script type="text/javascript" src="lesson22.js"></script> 
</head> 
<body> 
<button>show</button> 
</body> 
</html> 
復制代碼 代碼如下:
 
(function(){ 
Ext.Loader.setConfig({ 
enabled:true, //開啟異步加載模式 
paths:{ 
myApp:'lesson2/ux' //聲明文件的位置 
} 
}); 
Ext.onReady(function(){ 
Ext.require('ux.MyWin',function(){ 
var mw = Ext.create('ux.MyWin',{ 
title:'my Test' 
}); 
Ext.get('myButton').on('click',function(){ 
mw.show(); 
}); 
}); 
}); 
})(); 
復制代碼 代碼如下:
 
Ext.define('ux.MyWin',{ 
extend:'Ext.window.Window', 
title:'sign up', 
width:400, 
height:300 
}); 
新聞熱點
疑難解答
圖片精選