好多天沒寫博客了,最近工作一直很忙。。。
1.Reader數據讀取器
數據讀取器主要用於將數據代理讀取到的原始數據按照不同的規則進行解析,將解析后的數據保存在Model模型對象中。數據讀取器相當於原始數據格式與Extjs標准數據格式之間的橋梁,它屏蔽了原始數據格式不同對程序開發造成的影響。在Extjs中提供的數據解析器主要有如下3種:
Ext.data.reader.Json JSON數據讀取器
Ext.data.reader.Xml XML數據讀取器
Ext.data.reader.Array 數組數據讀取器
1.1 Ext.data.reader.Reader
Ext.data.reader.Reader是讀取器的父類,主要用於從數據源讀取結構化數據,它有兩個子類分別是JsonReader和XmlReader。下表列出了它的主要配置項和方法。
表1-1 Ext.data.reader.Reader主要配置項
配置項 | 參數類型 | 說明 |
idProperty | String | 設置作為數據唯一表示的字段名,默認為Model模型的id字段 |
implicitIncludes | Boolean | 設置是否級聯讀取數據,默認為true |
messageProperty | String | 設置獲取響應信息的屬性名 |
root | String | 設置返回信息的根名稱,為必選項 |
successProperty | String | 設置獲取成功狀態的屬性名,默認為success |
totalProperty | String | 設置獲取記錄總數的屬性名,默認為total |
表1-2 Ext.data.reader.Reader主要方法
方法 | 說明 |
read(Object response):Ext.data.ResultSet | 讀取響應對象,返回結果集 response:可以是一個XMLHttpRequest對象,可以是一個普通的Json對象 |
Ext.data.reader.Reader支持嵌套數據的讀取,它會根據實體模型Model中關系API簡歷關聯關系遍歷響應數據。
1.2 Ext.data.reader.Json
Ext.data.reader.Json 是讀取Json數據的數據讀取器,它根據實體模型Model中字段定義的映射關系解析原始數據,形成記錄集。
表 1-3 Ext.data.reader.Json 主要配置項
配置項 | 參數類型 | 說明 |
record | String | 定位在Json響應信息中發現記錄數據的位置,一般情況下不需要該配置項 |
useSimpleAccessors | Boolean | 設置是否使用簡單是陪方式,默認為false。 如屬性foo.bar.baz在默認情況下會從root中找foo屬性,然后在foo中找bar屬性,在bar中找baz屬性.在簡單模式下會最為一個整體處理,不會拆分. |
方法 |
說明 |
readRecords(Object data):Ext.data.ResultSet | 從json對象中讀取信息,返回結果集 data:數據對象,在該對象中包含與配置項root和titalProperty對應的屬性,分別表示包含記錄信息的數組和總記錄數 |
1.3 Ext.data.reader.Xml
Ext.data.reader.Xml 是讀取xml文檔格式信息的數據讀取器,它根據實體模型Model中字段定義的映射關系解析原始信息,形成記錄集。
注意:為了使瀏覽器可以正確的解析xml文檔,必須設置相應的content-type類型為‘text/xml’
表1-5 Ext.data.reader.Xml 主要配置項
配置項 | 參數類型 | 說明 |
record | String | 包含記錄信息元素的DomQuery路徑 |
方法 | 說明 |
getData(Object date):Object readRecords(Object doc): Ext.data.ResultSet |
獲取標准化的數據對象 從xml數據文檔中讀取信息,形成記錄集 doc:xml數據文檔對象 |
1.4 Ext.data.reader.Array
Ext.data.reader.Array繼承自Ext.data.reader.Json,是讀取二維數據信息的讀取器,內層數組是一個包含字段數據的數據行,如果字段映射存在字段將根據它的下標取值到model中,如果字段映射不存在則字段按字段的原始位置進行取值。Ext.data.reader.Array的主要配置項和方法請參考Ext.data.reader.Json相關說明。
2.Writer數據寫入器
數據寫入器主要用於將數據代理提交到服務器的數據進行編碼,相當於Extjs標准數據格式與服務器數據格式之間的橋梁,他屏蔽了服務器端數據格式不同對程序開發造成的影響。在Extjs中提供的數據寫入器有:
Ext.data.writer.Json Json寫入器
Ext.data.writer.Xml xml寫入器
2.1 Ext.data.writer.Writer
Ext.data.writer.Writer 是數據寫入器的父類,它負責處理請求對象,將數據轉換為指定格式,對於客戶端代理是不需要指定Writer 寫入器的。
表2-1 Ext.data.writer.Writer 主要配置項
配置項 | 參數類型 | 說明 |
nameProperty | String | 設置發送到服務器數據的鍵值屬性名 |
writerAllFields | Boolean | 設置是否向服務器寫入所有字段,false則指包含被修改的字段,默認為true |
方法 | 說明 |
getRecordData(Object record):Object | 獲取格式化之后的數據 record;需要發送的服務器記錄對象 |
2.2 Ext.data.writer.Json
JSON格式的數據寫入器,它會將實體模型model中的數據轉化為json格式發送到服務器。
wirter:{
type:'json'
}
發往服務器的數據為:{"id":1,"name":"tom","age":24}.
2.3Ext.data.writer.Xml
XML格式的數據寫入器,它會將Model中的數據轉換為xml發送到服務器。
表2-2 Ext.data.writer.Xml 主要配置項
配置項 | 參數類型 | 說明 |
defaultDocumentRoot | String | 設置當documentRoot為空時的默認根標簽名稱 |
documentRoot | String | 設置xml文檔的根標簽名稱,默認為xmlData |
header | String | 設置xml文檔的頭屬性,如encoding編碼或version版本,默認為”” |
record | String | 設置記錄節點的標簽名稱,默認為rocord |
3. Store數據集
Store數據集是一個客戶端模型對象Model的緩存,它可以為Extjs組件提供數據輸入,store通過數據代理夾在數據,也可以手工調用lodaData等方法加載數據,解析后的數據對象緩存在Store數據集中,並通過存取函數進行訪問。
在Extjs提供的數據集類主要包括:
Ext.data.AbstractStore、Ext.data.Store、Ext.data.ArrayStore、Ext.data.DirectStore、Ext.data.JsonPStore、Ext.data.JsonStore、Ext.data.XmlStore。
3.1 Ext.data.AbstractStore
Ext.data.AbstractStore是Ext.data.Store 和Ext.data.TreeStore的父類,它不能被直接實例化,但提供了大量的方法供子類使用,除非需要創建新的Store類,否則在大多數情況下應該使用Ext.data.Store類。
表3-1 Ext.data.AbstractStore 主要配置項
配置項 | 參數類型 | 說明 |
autoLoad | Boolean/Object | 設置數據集是否自動加載數據,如果設置為true或提供了加載的配置對象則數據集在創建后后自動調用load方法加載數據,默認為false。 |
autoSync | Boolean | 設置是否在數據修改后自動通過數據代理進行同步 |
fields | Array | 設置應用於模型的字段定義,store或自動根據fields定義創建模型類 |
proxy | String/Ext.data.proxy.Proxy /Object |
設置代理,可以是字符串,配置對象或者代理實例 |
storeId | String | 設置數據集id,這個id將被注冊到Ext.data.StoreManager中 |
表3-2 Ext.data.AbstractStore 主要方法
方法 | 說明 |
getNewRecords:Array | 獲取所有新增但未調用代理進行數據同步的記錄數組 |
getProxy:Ext.data.proxy.Proxy | 獲取數據代理 |
getUpdatedRecords:Array | 獲取被修改但是未調用代理進行數據同步的記錄數組 |
isLoading:Boolean | 獲取當前store是否處於加載狀態 |
load(Object options):Void | 加載數據,options:傳到代理中的Ext.data.Operation操作參數配置對象 |
sync:Void | 同步數據 |
3.2 Ext.data.Store
Ext.data.Store 是一個基本的數據集類,它通過數據代理讀取數據,提供了排序、過濾、查找等基本功能。
表3-3 Ext.data.Store主要配置項
配置項 | 參數類型 | 說明 |
buffered | Boolean | 設置是否允許Store緩存之前讀取的數據 |
clearOnPageLoad | Boolean | 設置在分頁查詢中是否請求當前頁面數據,默認為true,設置為false則允許在一頁中顯示大量數據 |
data | Array | 內置數據對象組成的數組,在數據集初始化之后該數組會讀入數據集 |
model | String | 設置store關聯的Model模型 |
proxy | String/ Ext.data.proxy.Proxy /Object |
設置數據代理 |
purgePageCount | Number | 設置在更新緩存數據之前,緩存數據的最大頁數,設置為0則不更新緩存數據,該配置項只在buffered設置為true時生效 |
remotrFilter | Boolean | 設置是否使用遠程過濾,默認為fakse |
remoteGroup | Boolean | 設置是否使用遠程分組,默認為fakse |
remoteSort | Boolean | 設置是否使用遠程排序,默認為fakse |
sortOnFilter | Boolean | 設置在過濾數據時是否同時進行排序,默認為true,該配置項只在客戶端過濾時生效 |
方法名 | 說明 |
Store(Object config) | 創建一個新的數據集對象 config:一個包含數據集必要信息的配置對象 |
add(Object data):Array | 增加數據記錄到數據集中 data:一個數據對象的數組 |
aggregate(Function fn,[Object scope],Boolean grouped,[Array args]):void | 允許在數據集上聚合函數 fn:聚合函數,分組后的記錄數是唯一的參數 scope:聚合函數的執行范圍 grouped:設置是否對Store中的每一組調用聚合函數,該參數只在具有一個分組字段groupFiled時生效 args:傳遞到聚合函數中的任何其他參數 |
average(String field,Boolean grouped):void | 獲取指定字段的平均值 field:計算平均值的字段名 grouped:設置是否對Store中的每一組調用聚合函數,該參數只在具有一個分組字段groupFiled時生效 |
clearFilter(Boolean suppressEvent):void | 清除過濾器 suppressEvent:設置是否壓制事件,如果為true則在清空過濾器時不會觸發datachanged事件 |
clearGrouping:void | 清除分組 |
collect(String dataIndex,[Boolean allowNull],[Boolean bypassFilter]):void | 收集數據集中指定索引的唯一值集 dataindex:索引屬性名 allownull:true則允許為空/undefined或者空字符串 bypassFIlter:true則收集所有記錄,false則收集過濾后的數據 |
count(Boolean grouped) :void | 獲取Store中的記錄數 grouped:true則以分組的方式計算記錄數,該參數只在具有一個分組字段groupFiled時生效 |
each(Function fn,[Object scope]):void | 遍歷數據集中的記錄對象,並將數據記錄對象傳入指定的函數中 fn:遍歷數據集調用的函數,當前數據記錄對象作為第一個參數傳遞到該函數中,返回false則終止循環 scope:函數作用域 |
filter(Mixed filters,String value):void | 過濾數據集 filter:過濾器集合 value:過濾值,當第一個參數為字段名時生效 |
filterBy(Function fn,[Object scope]):void | 通過特殊函數過濾數據集.數據集中的每一個數據記錄對象都會傳入該函數,如果函數返回true則記錄被保留,否則記錄會被過濾掉 fn:過濾函數,一下2個參數將被傳遞到該函數中 Record:當前傳入過濾函數的記錄對象 id:數據記錄的id scope:過濾函數的作用域 |
find(String fieldName,String/RegExp value,[Number startIndex],[Boolean anyMatch],[Boolean caseSensitive],Boolean exactMatch):Number | 在數據集中查詢匹配字段值的第一個記錄,該記錄的索引值將被返回(匹配失敗返回-1) fieldName:要查找的字段名 value:任意一個匹配字段值的字符串或者正則表達式 startInde:開始查找的索引位置 anyMatch:true則匹配字段值的全部,否則從開頭進行匹配 caseSensitive:true表示區分大小寫 exactMatch:true表示執行精確匹配,默認為false |
findBy(Function fn,[Object scope],[Number startIndex]):Number | 通過調用查詢函數匹配數據集中第一個滿足要求的記錄,該記錄的索引值將被返回,失敗返回-1. fn:查詢函數,一下2個參數將被傳遞到該函數中 Record:當前傳入過濾函數的數據記錄對象,可以通過調用Ext.data.Record.get方法獲取字段值 id:數據記錄id scope:作用域 startIndex:開始查詢的索引位置 |
fineExact(String fieldName,Mixed value,[Number startIndex]):Number | 通過指定字段名和匹配值查詢數據集第一個滿足要求的記錄,該記錄的索引值將被返回,失敗返回-1. fieldName:字段名 value:匹配值 startIndex:開始查詢的索引位置 |
findRecord() | 參考find方法,返回值為記錄對象 |
first(Boolean grouped):Model/undefined | 便利函數,用於獲取Store中的第一條記錄 :grouped:true則返回所有分組的第一條記錄,該參數只在具有一個分組字段groupFiled時生效 |
getAt(Number index):Model | 取得指定索引位置的數據記錄對象 index:數據記錄對象在數據集中的索引位置 |
getById(String Id):Model | 取得指定id的數據記錄對象 |
getCount():Number | 取得數據集中緩存的數據記錄總數.如果使用了分頁則該值可能不是數據的總數量,如果被解析的數據對象中包含了數據的總數量則可以通過getTotalCaout方法得到 |
getGroupString(Model instance):void | 取得指定模型實例的分組字符串 |
getGroups:Array | 取得分組的數據對象 |
getPageFromRecordIndex(Number index):Number | 獲取指定索引記錄所在的頁號 |
getRange([Number startindex],[Number endIndex]):Model[] | 取得指定范圍的數據記錄數組,index默認為0到最后一個記錄的索引 |
getTotalCount():Number | 取得從服務器返回的數據記錄總數.如果使用分頁則該值必須包含咋服務器返回的數據對象中,當客戶端數據集內容發生變化時不會更新該值 |
group(String|Array groupers,String direction):void | 分組數據 groupers:一個字段名,或分組器配置對象組成的數組 direction:排序方式,默認為ASC |
hasPendingRequests:number | 獲取未完成的請求數量 |
indexOf(Model record):number | 取得數據記錄對象在數據集緩存中的索引位置,如果數據記錄對象不在緩存中則返回-1 |
indexOfId(String id):Number | 取得指定Id的數據記錄對象在數據集緩存中的索引位置,如果數據記錄對象不在緩存中則返回-1 |
indexOfTatal(Model record):number | 取得數據記錄在0到totalCount之間的索引位置 |
insert(number index, Model[] records):void | 插入數據記錄到數據集中指定的索引位置,該操作會觸發數據集的add事件 |
isFiltered():Boolean | 返回當期數據集中的數據是否經過過濾 |
isGrouped():Boolean | 返回當期數據集中的數據是否經過分組 |
last(Boolean grouped):Model/undefined | 獲取Store中的最后一條記錄 |
load(object/Function options):void | 使用數據代理加載數據 |
loadData(Array data,[Boolean append]):void | 直接加載數組數據到Store中 append:true表示將數據追加到緩存中,false表示用新數據替換舊數據 |
loadPage(Number page):void | 讀取指定頁碼的數據,會根據page參數計算出start和limit參數進行傳遞 |
loadRecords( Array reocrds,object options):void | 加載數組數據到store中,會觸發datachanged事件,該方法通常被數據代理內部使用 |
max(String field,Boolean grouped):Mixed/undefined | 取得指定字段的最大值 |
min(String field,Boolean grouped):Mixed/undefined | 獲取指定字段的最小值 |
nextPage:void | 讀取當前數據集的下一頁數據 |
prefetch(Number page,Object options):void | 預讀指定頁碼的數據 |
previousPage:void | 讀取當前數據集的上一頁數據 |
queryBy(Function fn,[Object scope]):MixedCollection | 通過調用過濾函數來查詢滿足要求的記錄,如果過濾函數返回true則當前數據記錄對象將包含在查詢結果中 |
remove(Model/Array records) | 從數據集中刪除數據記錄對象,該操作會觸發數據集的remove事件,在remove事件之后觸發datachanged事件 |
removeAll(Boolean silent):void | 從數據集中刪除所有數據,silent為true則不觸發事件 |
removeAt(Number index):void | 從數據集中刪除指定索引位置的數據 |
sum(String field,Boolean grouped):Number | 獲取指定字段的和值 |
3.3 Ext.data.ArrayStore、Ext.data.JsonStore和Ext.data.XmlStore
為了方便使用Store讀取各類數據,Extjs提供了內置數據讀取器的輔助Store類來加速程序的開發過程,
Ext.data.JsonStore:內置了Ext.data.reader.Json
Ext.data.XmlStore:內置了Ext.data.reader.Xml
Ext.data.ArrayStore:內置了Ext.data.reader.Array
詳細使用同Store類似,就不再詳細說明
3.4 Ext.data.DirectStore和Ext.data.JsonPStore
extjs還提供了內置不同代理以及數據讀取器的輔助類
Ext.data.DirectStore:內置了Ext.data.proxy.Direct代理和Ext.data.reader.Json讀取器
Ext.data.JsonPStore:內置了Ext.data.proxy.JsonP代理和Ext.data.reader.Json讀取器
詳細也不再詳細說明.
--本篇完--