ExtJs--数据存储与传输-高级store
前面几篇文章介绍了proxy、reader、store,实际开发时,并不需要每次都对proxy、reader、store这三个对象进行配置,EXT为我们提供了几种可选择的整合方案。
1. SimpleStore= Store+ MemoryProxy+ ArrayReader
1
2
3
4
5
6
7
8
9
10
11
12
13
|
var ds = Ext.data.SimpleStore({
data: [
['id1','name1','descn1'],
['id2','name2','descn2']
],
fields: ['id','name','descn']
});
|
SimpleStore是专为简化读取本地数组而设计的,设置上MemoryProxy需要的data和ArrayReader需要的fields就可以使用了。
2.JsonStore= Store+ HttpProxy+ JsonReader
1
2
3
4
5
6
7
8
9
|
var ds = Ext.data.JsonStore({
url: 'xxx.jsp',
root: 'root',
fields: ['id','name','descn']
});
|
JsonStore将JsonReader和HttpProxy整合在一起,提供了一种从后台读取JSON信息的简便方法,大多数情况下可以考虑直接使用它从后台读取数据。
3.Ext.data.GroupingStore对数据进行分组
Ext.data.GroupingStore继承自Ext.data.Store,它的主要功能是可以对内部的数据进行分组,我们可以在创建Ext.data.GroupingStore时指定根据某个字段进行分组,也可以在创建实例后调用它的groupBy()函数对内部数据重新分组,如下面的代码所示。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
var ds = new Ext.data.GroupingStore({
data: [
['id1','name1','female','descn1'],
['id2','name2','male','descn2'],
['id3','name3','female','descn3'],
['id4','name4','male','descn4'],
['id5','name5','female','descn5']
],
reader: new Ext.data.ArrayReader({
fields: ['id','name','sex','descn']
}),
groupField: 'sex',
groupOnSort: true
});
|
上例中,我们使用groupField作为参数,为Ext.data.Grouping设置了分组字段,另外还设置了groupOnSort参数,这个参数可以保证只有在进行分组时才会对Ext.data.Grouping- Store内部的数据进行排序。如果采用默认值,就需要手工指定sortInfo参数,从而指定默认的排序字段和排序方式,否则就会出现错误。
创建Ext.data.GroupingStore的实例之后,我们还可以调用groupBy()函数重新对数据进行分组。因为我们设置了groupOnSort:true,所以在重新分组时,EXT会使用分组的字段对内部数据进行排序。如果不希望对数据进行分组,也可以调用clearGrouping()函数清除分组信息,如下面的代码所示。
1
2
3
|
ds.groupBy('id');
ds.clearGrouping();
|