1. 程式人生 > >ExtJS教程(6)---Ext.data.Store

ExtJS教程(6)---Ext.data.Store

Store通常與Model結合使用,Store是Model的集合

 Ext.define('User', {
     extend: 'Ext.data.Model',
     fields: [
         {name: 'firstName', type: 'string'},
         {name: 'lastName',  type: 'string'},
         {name: 'age',       type: 'int'},
         {name: 'eyeColor',  type: 'string'}
     ]
 });

 var myStore = Ext.create('Ext.data.Store', {
     model: 'User',
     proxy: {
         type: 'ajax',
         url: '/users.json',
         reader: {
             type: 'json',
             rootProperty: 'users'
         }
     },
     autoLoad: true
 });
還可以這樣寫
Ext.create('Ext.data.Store', {
     fields:['firstName','lastName','age','eyeColor']
     proxy: {
         type: 'ajax',
         url: '/users.json',
         reader: {
             type: 'json',
             rootProperty: 'users'
         }
     },
     autoLoad: true
 });

第一種寫法適合在專案開發中使用,Model類很明確,並且可以再Model中定義增刪改查的地址,在得到Model之後可以直接對Model操作,同時可以在Model中做資料型別的轉換及資料驗證。

第二種適用於快速開發,僅僅侷限於對Model中資料的使用,無法定義Model中屬性的資料型別。

store的常用方法有下面這些:

count( [grouped] ) : Number
--統計Store中的總記錄數


each( fn, [scope] )
--遍歷Store中的Model


filter( [filters], [value] )
--過濾資料


filterBy( fn, [scope] )
--過濾資料 fn(record,id),返回true表示匹配


find( fieldName, value, [startIndex], [anyMatch], [caseSensitive], [exactMatch] ) : Number
--根據欄位名及欄位值查詢Model,返回的是Model在Store中的索引位置


findBy( fn, [scope], [startIndex] ) : Number
--根據方法查詢資料,fn(record,id),返回true表示匹配,返回的是Model在Store中的索引位置


getAt( index ) : Ext.data.Model
--獲取第i個Model


getById( id ) : Ext.data.Model
--根據ID獲取資料


load( [options] )
--載入資料,執行load方法Store會從後臺請求資料


loadData( data, [append] )
--將data載入到Store中


nextPage( options )
--下一頁


previousPage( options )
--上一頁


query( property, value, [anyMatch], [caseSensitive], [exactMatch] ) : Ext.util.MixedCollection
--根據欄位名及欄位值查詢Model,返回Model集合


queryBy( fn, [scope] ) : Ext.util.MixedCollection
--根據方法查詢資料,fn(record,id),返回true表示匹配,返回Model集合


reload( options )
--重新載入Store


remove( records )
--刪除Store中的資料


removeAll( [silent] )
--刪除Store中所有的資料


setProxy( proxy ) : Ext.data.proxy.Proxy
--設定Ajax代理