Extjs4.1.x 框架搭建 采用Application動(dòng)態(tài)按需加載MVC各模塊完美實(shí)現(xiàn)
中午的時(shí)候發(fā)了第一篇 Extjs4.1.x 框架搭建 采用Application動(dòng)態(tài)按需加載MVC各模塊 ,發(fā)現(xiàn)實(shí)現(xiàn)上還是有問(wèn)題,有很多理解不到位的地方,晚上詳細(xì)解決下了,終于實(shí)現(xiàn)MVC各模塊按需加載了,哈皮。
上篇文章中,關(guān)于ExtJs這個(gè)玩意的評(píng)論就跟java和.Net那個(gè)好一樣,既然上了賊船,就難下了,而且對(duì)于企業(yè)級(jí)的應(yīng)用我個(gè)人覺(jué)得Extjs框架還是不錯(cuò)的,尤其是沒(méi)有UI設(shè)計(jì)的團(tuán)隊(duì)(苦逼的程序員就兼UI吧),起碼難得發(fā)現(xiàn)一個(gè)做的比較好的UI框架(國(guó)產(chǎn)的miniUI貌似看的過(guò)去,其他的就有點(diǎn)扯淡了[什么EasyUI、Dojo、JqueryUI等等]),2年前選擇了Extjs2.0之后收費(fèi)了,停了一段時(shí)間,后面做了比較久的Ext.Net(主要是開(kāi)發(fā)效率高),現(xiàn)在還是轉(zhuǎn)回了ExtJs4,又到了起點(diǎn),悲吹....干吧!
扯遠(yuǎn)了,回歸正題:中午的時(shí)候碰到一個(gè)問(wèn)題,控件的事件被注銷(xiāo)了,思索了下考慮是application重新創(chuàng)建覆蓋主框架的問(wèn)題,那么也就是說(shuō)整個(gè)系統(tǒng)只能采用一個(gè)application,那么如何動(dòng)態(tài)的加載controller呢?只要?jiǎng)討B(tài)的加載了controller,其他的view、store等都會(huì)被一次加載。
首先我們需要定義一個(gè)公共方法讓application加載controller
//動(dòng)態(tài)加載js模塊,****重要
var application;
Ext.Loader.setConfig({ enabled: true });
Ext.require([
'Ext.app.Application',
'Ext.app.Controller'
]);
Ext.app.Controller.implement({
//MVC 加載模型
loadModel: function () { },
//MVC 加載視圖
loadView: function () { },
getApplication: function () {
return this.application;
}
});
Ext.app.Application.implement({
//MVC 加載控制器 param {String/Array} controllers
loadModule: function (controllers) {
var me = this;
var controllers = Ext.Array.from(controllers), ln = controllers.length, i, controller;
for (i = 0; i < ln; i++) {
var name = controllers[i];
if (!this.controllers.containsKey(name)) {
controller = Ext.create(
this.getModuleClassName(name, 'controller'), {
application: this,
id: name
});
this.controllers.add(controller);
// 優(yōu)先加載模型
controller.loadModel();
controller.init(this);
controller.onLaunch(this);
//動(dòng)態(tài)構(gòu)建視圖 & 綁定模型數(shù)據(jù)
controller.loadView();
}
}
}
});
/*****END************/
OK,看整個(gè)的"組織架構(gòu)的"js結(jié)構(gòu)如下

當(dāng)我們單擊功能節(jié)點(diǎn)樹(shù)的"組織架構(gòu)"的時(shí)候,開(kāi)始加載Controller的Org.js,是的只需要加載這一個(gè)就可以了,其他的他會(huì)自動(dòng)加載,也是MVC的優(yōu)點(diǎn):
@{
ViewBag.Title = "組織架構(gòu)管理";
}
<script>
/*
寫(xiě)法一:
application.loadModule("Users");
//var module = application.getController("Users");
//var viewName = module.views[1];
//alert(viewName);
//var view = module.getView("user.List");或者是viewName
//var panel = view.create();
//Global.ExtTabDoLayout(panel);
寫(xiě)法二:
var main = new Ext.Panel({
border: false,
layout: 'fit',
items: [{
xtype: 'userlist'
}]
});
Global.ExtTabDoLayout(main);
*/
application.loadModule("Org");
var main = new Ext.Panel({
border: false,
layout: 'border',
items: [{ xtype: 'OrgTree' }, { xtype: 'OrgUserGrid' }]
});
//添加到tab里
Global.ExtTabDoLayout(main);
</script>
這樣整個(gè)組織架構(gòu)的頁(yè)面搭建就實(shí)現(xiàn)了,而且是按需加載本模塊的,各個(gè)事件不會(huì)沖突。
具體的代碼太多了見(jiàn)附件。
這還沒(méi)開(kāi)始寫(xiě)業(yè)務(wù)邏輯呢,就這么寫(xiě)了這一堆的js文件,看來(lái)整個(gè)架構(gòu)完成,哥哥我非死即傷( ⊙o⊙ )哇
相關(guān)文章
asp.net簡(jiǎn)化接收參數(shù)值的函數(shù)
獲取querystring 參數(shù)名2008-05-05.NET Core對(duì)象池的應(yīng)用:設(shè)計(jì)篇
本文主要講解對(duì)象池的三個(gè)核心對(duì)象:表示對(duì)象池的ObjectPool<T>對(duì)象、對(duì)象值提供者的ObjectPoolProvider對(duì)象,已及控制池化對(duì)象創(chuàng)建與釋放行為的IPooledObjectPolicy<T>對(duì)象。感興趣的小伙伴可以參考一下這篇文章2021-09-09ASP.NET MVC 3仿Server.Transfer效果的實(shí)現(xiàn)方法
這篇文章主要介紹了ASP.NET MVC 3仿Server.Transfer效果的實(shí)現(xiàn)方法,需要的朋友可以參考下2015-10-10.NET獲取枚舉DescriptionAttribute描述信息性能改進(jìn)的多種方法
這篇文章主要介紹了.NET獲取枚舉DescriptionAttribute描述信息性能改進(jìn)的多種方法 的相關(guān)資料,需要的朋友可以參考下2016-01-01asp.net+js實(shí)時(shí)奧運(yùn)金牌榜代碼
運(yùn)期間,公司交給我一個(gè)任務(wù),在公司主頁(yè)上放上奧運(yùn)金牌榜的排名,之前的實(shí)現(xiàn)方式是采用ajax2008-09-09.NET?Core?Web?APi類(lèi)庫(kù)內(nèi)嵌運(yùn)行的方法
這篇文章主要介紹了.NET?Core?Web?APi類(lèi)庫(kù)內(nèi)嵌運(yùn)行的方法,本節(jié)我們重點(diǎn)討論如何內(nèi)嵌運(yùn)行.NET Core Web APi類(lèi)庫(kù),同時(shí)介紹了兩種激活比如控制器特性方案,需要的朋友可以參考下2022-09-09ASP.NET2.0數(shù)據(jù)庫(kù)入門(mén)之SQL Server
ASP.NET2.0數(shù)據(jù)庫(kù)入門(mén)之SQL Server...2006-09-09asp.net 在處理向該請(qǐng)求提供服務(wù)所需的配置文件時(shí)出錯(cuò)
遭遇:“說(shuō)明: 在處理向該請(qǐng)求提供服務(wù)所需的配置文件時(shí)出錯(cuò)。請(qǐng)檢查下面的特定錯(cuò)誤詳細(xì)信息并適當(dāng)?shù)匦薷呐渲梦募?。”錯(cuò)誤2010-03-03asp.net實(shí)現(xiàn)利用反射,泛型,靜態(tài)方法快速獲取表單值到Model的方法
這篇文章主要介紹了asp.net實(shí)現(xiàn)利用反射,泛型,靜態(tài)方法快速獲取表單值到Model的方法,結(jié)合實(shí)例形式分析了asp.net中反射,泛型,靜態(tài)方法給model賦值的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11