Ext.data.reader.Reader
Readers通常用于翻译数据，使其被加载为 Model 实例或Store, 该数据一般是一个AJAX请求的响应数据. 一般情况下不需要直接创建一个Reader实例， 因为Reader总是和Proxy一起使用， 且其将使用Proxy的reader 配置属性配置
|
1
2
3
4
5
6
7
8
9
10
11
|
Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'ajax',
url : 'users.json',
reader: {
type: 'json',
root: 'users'
}
},
}); |
以上的reader是配置来消耗一个JSON字符串，使其开起来如下:
|
1
2
3
4
5
6
7
|
{ "success": true,
"users": [
{ "name": "User 1" },
{ "name": "User 2" }
]
} |
加载嵌套数据
根据每个模型上的associations配置，Readers拥有自动加载多级嵌套的数据对象的能力. 以下是一个例子，用于验证一个虚构的CRM系统（管理了User、Orders、OrderItems、Products等模型）中的各种结合的灵活性。 首先我们要定义这些模型:
|
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
Ext.define("User", {
extend: 'Ext.data.Model',
fields: [
'id', 'name'
],
hasMany: {model: 'Order', name: 'orders'},
proxy: {
type: 'rest',
url : 'users.json',
reader: {
type: 'json',
root: 'users'
}
}
});Ext.define("Order", {
extend: 'Ext.data.Model',
fields: [
'id', 'total'
],
hasMany : {model: 'OrderItem', name: 'orderItems', associationKey: 'order_items'},
belongsTo: 'User'
});Ext.define("OrderItem", {
extend: 'Ext.data.Model',
fields: [
'id', 'price', 'quantity', 'order_id', 'product_id'
],
belongsTo: ['Order', {model: 'Product', associationKey: 'product'}]
});Ext.define("Product", {
extend: 'Ext.data.Model',
fields: [
'id', 'name'
],
hasMany: 'OrderItem'
}); |
这个可能有很多种理解 - 基本上，一个Usrer拥有多个Orders，而每个Orders是由多个OrderItems组成的。 最后，每个OrderItem都包含单独一个Product. 这就允许我们重构造数据如下：
|
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
28
29
30
31
32
33
34
|
{ "users": [
{
"id": 123,
"name": "Ed",
"orders": [
{
"id": 50,
"total": 100,
"order_items": [
{
"id" : 20,
"price" : 40,
"quantity": 2,
"product" : {
"id": 1000,
"name": "MacBook Pro"
}
},
{
"id" : 21,
"price" : 20,
"quantity": 3,
"product" : {
"id": 1001,
"name": "iPhone"
}
}
]
}
]
}
]
} |
该JSON响应就是多级嵌套- 将返回所有的Users(在本例中为简单起见，只写了一个User), 每个User中的Orders的所有项(一样只写其中一个为例)， 每个Order中的OrderItems的所有项(本例中显示了2个order项),最后Product通过每个OrderItem关联在一起. 现在我们可以读取数据并使用它通过如下方式：
|
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
|
var store = Ext.create('Ext.data.Store', {
model: "User"
});store.load({ callback: function() {
//被加载的user
var user = store.first();
console.log("Orders for " + user.get('name') + ":")
//遍历每个User中的Orders
user.orders().each(function(order) {
console.log("Order ID: " + order.getId() + ", which contains items:");
//遍历每个Order中的OrderItems
order.orderItems().each(function(orderItem) {
//我们都知道Product数据已经被加载，所以我们可以使用同步方法getProduct
//一般来说，我们会使用异步版本的 (参考 Ext.data.association.BelongsTo)
var product = orderItem.getProduct();
console.log(orderItem.get('quantity') + ' orders of ' + product.get('name'));
});
});
}
}); |
运行以上代码，结果如下:
|
1
2
3
4
|
Orders for Ed:
Order ID: 50, which contains items:2 orders of MacBook Pro3 orders of iPhone |