Ext.data在命名空間中定義了一系列store、reader和proxy。Grid和ComboxBox都是以Ext.data為媒介獲取數(shù)據(jù)的,它包含異步加載、類型轉(zhuǎn)換、分頁(yè)等功能。EXT默認(rèn)支持Array、JSON、XML等數(shù)據(jù)格式,可以通過(guò)Memory、HTTP、 ScriptTag等方式獲得這些格式的數(shù)據(jù)。如果要實(shí)現(xiàn)新的協(xié)議和新的數(shù)據(jù)結(jié)構(gòu),只需要擴(kuò)展reader和proxy即可。本章主要介紹EXT中的數(shù)據(jù)存儲(chǔ)與傳輸。

一、Ext.data.Connection

Ext.data.Connection主要用于在Ext.data.HttpProxy和Ext.data.ScriptTagProxy中執(zhí)行與后臺(tái)交互的任務(wù),它會(huì)從指定的URL獲得數(shù)據(jù),并把后臺(tái)返回的數(shù)據(jù)交給HttpProxy或ScriptTagProxy處理,Ext.data.Connection的使用方式如下面所示:

(1) 首先創(chuàng)建一個(gè)新的Ext.data.Connection實(shí)例。

  1. var conn=new Ext.data.Connection({  
  2.                 autoAbort:false,  
  3.                 defaultHeaders:{  
  4.                     referer:'http://www.sina.com.cn'  
  5.                 },  
  6.                 disableCaching:false,  
  7.                 extraParams:{  
  8.                     name:'name'  
  9.                 },  
  10.                 method:'GET',  
  11.                 timeout:300,  
  12.                 url:'01-01.txt'  
  13.             });  

 

(2) 在創(chuàng)建conn之后,可以調(diào)用request()函數(shù)發(fā)送請(qǐng)求,處理返回的結(jié)果。

  1. conn.request({  
  2.                 success:function(response){  
  3.                     Ext.Msg.alert('info',response.responseText);  
  4.                 },  
  5.                 failure:function(){  
  6.                     Ext.Msg.alert('warn','failure');  
  7.                 }  
  8.             });  
  

 

(3) Ext.data.Connection還提供了abort([Number transactionId])函數(shù),當(dāng)同時(shí)有多個(gè)請(qǐng)求發(fā)生時(shí),根據(jù)指定的事務(wù)id放棄其中的某一個(gè)請(qǐng)求,如果不指定id,則會(huì)放棄最后一個(gè)請(qǐng)求。

二、Ext.data.Record

Ext.data.Record就是一個(gè)設(shè)定了內(nèi)部數(shù)據(jù)類型的對(duì)象,它是Ext.data.Store的最基本組成部分。 Ext.data.Record的主要功能是保存數(shù)據(jù),并且在內(nèi)部數(shù)據(jù)發(fā)生改變時(shí)記錄修改的狀態(tài),它還可以保留修改之前的原始值。

(1) 我們使用Ext.data.Record時(shí),通常都是由create()函數(shù)開始,首先用create()函數(shù)創(chuàng)建一個(gè)自定義的Recore類型,如下所示:

  1. var PersonRecord=Ext.data.Record.create([  
  2.                 {name:'name',type:'string'},  
  3.                 {name:'sex',type:'int'}  
  4.             ]);  

 

(2) PersonRecord就是我們定義的新類型,然后我們使用new關(guān)鍵字創(chuàng)建PersonRecord的實(shí)例:

  1. var boy=new PersonRecord({  
  2.                 name:'boy',  
  3.                 sex:0  
  4.             });  

 

(3) 現(xiàn)在,我們得到了PersonRecord的實(shí)例boy,如何得到它的屬性值?以下有三種方法:

  1. alert(boy.data.name);  
  2. alert(boy.data['name']);  
  3. alert(boy.get['name']);  

 

三、Ext.data.Store

Ext.data.Store是EXT中用來(lái)進(jìn)行數(shù)據(jù)交換和數(shù)據(jù)交互的標(biāo)準(zhǔn)中間件,無(wú)論是Grid還是ComBox,都是通過(guò)它實(shí)現(xiàn)數(shù)據(jù)讀取、類型轉(zhuǎn)換、排序分列和搜索等操作。Ext.data.Store中有一個(gè)Ext.data.Record數(shù)組,所有數(shù)據(jù)都存放在這些 Ext.data.Record實(shí)例中,為后面的讀取和修改操作做準(zhǔn)備。

(1) 在使用之前,首先要?jiǎng)?chuàng)建一個(gè)Ext.data.Store的實(shí)例,如下面代碼:

  1. var data=[  
  2.                 ['boy',0],  
  3.                 ['girl',1]  
  4.             ];  
  5.             var store=new Ext.data.Store({  
  6.                 proxy:new Ext.data.MemoryProxy(data),  
  7.                 reader:new Ext.data.ArrayReader({},PersonRecord)  
  8.             });  
  9.             store.load();  

 

(2) 每個(gè)store最少需要兩個(gè)組件的支持,分別是proxy和reader,proxy是用于從某個(gè)途徑讀取原始數(shù)據(jù),reader用于將原始數(shù)據(jù)轉(zhuǎn)換成 Record實(shí)例。

四、小結(jié)

本章主要詳細(xì)介紹了Ext.data.Record和Ext.data.Store的功能和基本使用方法,這兩個(gè)類結(jié)合起來(lái)形成了Ext.data 中的主體數(shù)據(jù)模型,很多組件都是建立在它們之上的,至于其他的常用的proxy,reader,store:SimpleStore和JsonStore 則在后面學(xué)習(xí)中給出詳細(xì)介紹。