Ext Js 3.2 store的用法学习

1：store可以理解为数据存储器，也可以理解为客户端的小型数据表，提供缓存等功能，在Ext Js中，GridPanel、ComboBox、DataView等控件一般是直接与store打交道，直接通过store来获得控件中需要展现的数据等，一个store可以包含多个Record，同时store又包含了数据来源，数据解析器等相关信息。store通过调用具体的数据解析器(DataReader)来解析指定类型或者格式的数据(DataProxy)，并转换成记录集的形式保存在store中，作为其他控件的数据输入。

 

2：store中对数据进行排序

    var store = new Ext.data.Store({

           proxy: new Ext.data.MemoryProxy(data),

           reader: new Ext.data.ArrayReader({}, PersonRecord),

          sortInfo: {

                  field: 'name',

                 direction: desc

           }

     });

通过以上代码，可以在数据加载完成之后对数据进行根据name进行排序，同样使用store.setDefaultSort('name', desc);也可以实现对数据的排序效果功能；也可以在任何时候

调用sort函数，如store.sort('name', desc)；对store中的数据进行排序，如果希望获得store的排序信息，可以调用store.getSortState()函数，返回的是类似{field: "name", direction: "desc"}的JSON数据对象。

    与排序有关的参数还有remoteSort，这个参数是用来实现后台排序功能的，当设置为remoteSort: true时，store会在向后台请求数据时自动加入sort和dir两个参数，分别对应

排序的字段和排序的方式，由后台获取并处理这两个参数，在后台对所需数据进行排序操作，remoteSort:true也会导致每次执行sort()时都要去后台重新加载数据，而不能只对本地数据进行排序。

3：从store中获取数据

    最简单的方式就是根据record在store中的行号获得对应的record，然后就可以用get()函数获得其中的数据

    store.getAt(1).get('title');

  

    使用for循环对获取的数据进行遍历，依次得到他们的数据，如下面的代码所示：

    for(var i  = 0; i < store.getCount(); i++) {

           var record =  store.getAt(i);

           alert(record.get('title'));

    }

   还可以使用each函数，

   store.each(function(record) {

           alert(record.get('title'));

      });

 each可以接受一个函数作为参数，遍历内部record，并将每个record作为参数传递给function()处理，如果希望停止遍历，可以让function返回false

   还可以使用getRange()函数连续获得多个record，只需要指定开始和结束位置的索引值，Ext Js还提供了函数find()和findBy()，可以利用他们对store中的数据进行搜索，

如下面代码所示：

   var records = store.getRange(0, 1);

    for(var i = 0; i < records.length; i++) {

         var record = records[i];

         alert(record.get('title'));

   } 

  find(String property,  String/RegExp value,  [Number startIndex],  [Boolean anyMatch],  [Boolean caseSensitive]);

  第一个参数property表示搜索的字段名，第二个参数value是匹配用的字符串或者正则表达式；第三个参数startIndex表示从第几行开始搜索，第四个参数anyMatch为true时，

不必从头开始匹配，第五个参数caseSensitive为true时，会区分大小写。

    var index = store.find('title', 'g');

    alert(store.getAt(index).get('title'));

  findBy(Function fn, [Object scope], [Number startIndex]) : Number

 findBy函数允许用户使用自定义函数对内部数据进行搜索，fn返回true时，表示查找成功，于是停止遍历并返回行号，fn返回false时，表示查找失败，继续遍历

  index = store.findBy(function(record, id) {

       return record.get('title') == '新闻' && record.get('number') == 10;

});

alert(store.getAt(index).get('title'));

4：更新store中的数据

   可以使用add()方法向store结尾添加一个或者多个Record, 使用的参数可以使一个record实例，

    store.add(new PersonRecord({

         title: '新闻',

         number: 10

    }));
也可以添加一个数组：

   store.add([new PersonRecord({

           title: '新闻',

          number: 10

     }),  new PersonRecord({

         title: '新闻',

         number: 10

     })]); 

如果希望在添加之后立即对store排序，这样可以保证store中的数据有序的显示，如下所示：

     store.addSorted(new PersonRecord({

           title: '新闻',

          number: 10

     }));

 store会根据排序信息查找这条record应该插入的索引位置，根据根据得到的索引位置插入数据，从而实现对整体的排序，这个函数需要预先为store设置为本地排序，否则会不起作用。

  如果希望指定插入的索引位置，可以使用store.insert(3, new PersonRecord({

                        title: '新闻',

                       number: 10

                 }));

删除操作使用remove()和removeAll()函数，他们分别可以删除指定的record和清空整个store中的数据，如store.remove(store.getAt(0));

修改store中的数据：store.getAt(0).set('title', 'xxx');

修改record数据之后有两种选择，执行rejectChanges()撤销所做的修改，将修改过的record恢复到原来的状态，执行commitChanges()提交数据修改，在执行撤销和提交操作之前，可以使用getModifiedRecords()获得store中修改过的record数组，与修改数据相关的参数是pruneModifiedRecords，如果将它设置为true，当每次执行删除或者reload操作，都会清空所有修改，这样每次执行删除或者reload操作之后，getModifiedRecords()返回的就是一个空数组，否则仍然会得到上次修改过的record记录。

加载并显示数据：

    store.load({

          params: {start: 0, limit: 20},     //加载时发送的附加参数

          callback: function(records, options, success) {   //加载完毕时执行的回调函数，包含3个参数，其中，records参数表示获得的数据；

                 Ext.Msg.alert('info', '加载完毕');                         //options表示执行load时传递的参数，success表示是否加载成功

           }, 

           scope: store,    //指定回调函数执行时的作用域

            add: true       //为true时，load得到的数据会添加在原来的store数据的末尾，否则会先清空原来的数据，再将得到的数据添加到store中

    });

可以使用baseParams参数设置固定常量，该参数时一个JSON对象，其中的数据会作为参数发送给后台处理，如下面所示，

           store.baseParams.start = 0;

           store.baseParams.limit = 20;