EXTJS4 的 MVC模式的優(yōu)點(diǎn)與不足
EXT4終于發(fā)布了,厭倦了EXT3.x生成的臃腫的HTML代碼? EXT4在這方面的確做了很大的優(yōu)化。其中帶了資源占用減少和性能的提升。而EXT4引入的MVC模式更是將視圖與代碼邏輯分離。除了語(yǔ)法上與舊版有些許不同外。上手倒還是很快。但很快遇到的問(wèn)題也接踵而至。
在EXT4中 CRUD操作甚至能讓你從煩人的FORM提交解放出來(lái)。直接一條 ?Store.sync()搞定。非常方便。但馬上我便遇到了第一個(gè)問(wèn)題。倘若提交失敗,服務(wù)器返回的錯(cuò)誤信息如何顯示?如果只是單條記錄的操作,您可以使用 Model的 save方法來(lái)完成。例如:
var?rs?=?Ext.ModelManager.create(values,'OA.model.ChangePasswordModel');
rs.save({
success:function(r,o)
{
var?o=Ext.decode(o.response.responseText);??
Ext.Msg.show({
title:'溫馨提示',
msg:o.message,
icon:Ext.Msg.INFO,
buttons:Ext.Msg.OK,
fn:function()
{
win.close();
},scope:this
})
},
failure:function(r,o)
{
var?o?=?o.request.scope.reader.jsonData;
Ext.Msg.show({
title:'溫馨提示',
msg:o["message"],
icon:Ext.Msg.ERROR,
buttons:Ext.Msg.OK
})
},scope:this
}); 如果是多條記錄的刪除操作呢?
在閱讀了 Store Bath Proxy等類的源代碼后。發(fā)現(xiàn)錯(cuò)誤信息可以統(tǒng)一使用 偵聽(tīng)exception事件來(lái)完成。
遇到的第二個(gè)問(wèn)題是,如果您要?jiǎng)h除store中的一些記錄可以使用 Store.remove(records)來(lái)完成。然后調(diào)用 sync 與服務(wù)器同步。但如果服務(wù)器同步失敗……后果是本地已經(jīng)刪除的 記錄無(wú)法恢復(fù)。最后,我只得重寫了兩個(gè)方法。1、在remve的時(shí)候?qū)⒂涗洷4嬖谝獎(jiǎng)h除的記錄列表中。在 onDestroyRecords(私有方法 在服務(wù)器返回后調(diào)用)。再刪除這個(gè)列表中的記錄。代碼如下:
remove:?function(records,?/*?private?*/?isMove)?{
????????if?(!Ext.isArray(records))?{
????????????records?=?[records];
????????}
????????/*
?????????*?Pass?the?isMove?parameter?if?we?know?we're?going?to?be?re-inserting?this?record
?????????*/
????????isMove?=?isMove?===?true;
????????var?me?=?this,
????????????sync?=?false,
????????????i?=?0,
????????????length?=?records.length,
????????????isPhantom,
????????????index,
????????????record;
????????for?(;?i?<?length;?i++)?{
????????????record?=?records[i];
????????????index?=?me.data.indexOf(record);
????????????if?(me.snapshot)?{
????????????????me.snapshot.remove(record);
????????????}
????????????if?(index?>?-1)?{
????????????????isPhantom?=?record.phantom?===?true;
????????????????if?(!isMove?&&?!isPhantom)?{
????????????????????//?don't?push?phantom?records?onto?removed
????????????????????me.removed.push(record);
????????????????}
????????????????sync?=?sync?||?!isPhantom;
????????????}
????????}
????????me.fireEvent('datachanged',?me);
????????if?(!isMove?&&?me.autoSync?&&?sync)?{
????????????me.sync();
????????}
????},
????onDestroyRecords:?function(records,?operation,?success){
????????if?(success)?{
????????????var?me?=?this,
????????????????i?=?0,
????????????????length?=?records.length,
????????????????data?=?me.data,
????????????????snapshot?=?me.snapshot,
????????????????record;
????????????for?(;?i?<?length;?++i)?{
????????????????record?=?me.getById(records[i].get(records[i].idProperty||'id'));
????????????????if(null?!==?record)
????????????????{
????????????????record.unjoin(me);
????????????????data.remove(record);
????????????????if?(snapshot)?{
????????????????????snapshot.remove(record);
????????????????}
????????????????}else{
???????????????? console.log(records[i]);
????????????????}
????????????}
????????????me.removed?=?[];
????????}
????},




