玩转extjs5之Ext.data.JsonStore与Ext.data.XmlStore（五）

一、Ext.data.JsonStore

方便从JSON数据创建Ext.data.Store的小巧的帮助类。 JsonStore将自动配置一个Ext.data.reader.Json，例如：

var store = new Ext.data.JsonStore({
// store configs
autoDestroy: true,
storeId: 'myStore',

proxy: {
type: 'ajax',
url: 'get-images.php',
reader: {
type: 'json',
root: 'images',
idProperty: 'name'
}
},

//另外，可以配Ext.data.Model的名称(如 Ext.data.Store 中的例子)
fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date'}]
});

这个store采用一个返回的对象来配置:

{
images: [
{name: 'Image one', url:'/GetImage.php?id=1', size:46.5, lastmod: new Date(2007, 10, 29)},
{name: 'Image Two', url:'/GetImage.php?id=2', size:43.2, lastmod: new Date(2007, 10, 30)}
]
}

二、Ext.data.XmlStore

一个小巧的帮助类，用于更方便的从一个XML的数据来创建Ext.data.Store。 XmlStore将自动配置一个Ext.data.reader.Xml。例如：

var store = new Ext.data.XmlStore({
// store configs
autoDestroy: true,
storeId: 'myStore',
url: 'sheldon.xml', // 自动配置一个HttpProxy
// reader configs
record: 'Item', // 数据将有一个"Item"标签
idPath: 'ASIN',
totalRecords: '@TotalResults'
fields: [
// 设置field和xml数据的映射
// 第一个需要映射，其他的都很基本
{name: 'Author', mapping: 'ItemAttributes > Author'},
'Title', 'Manufacturer', 'ProductGroup'
]
});

这个store采用一个返回的对象来配置:

<?xml version="1.0" encoding="UTF-8"?>
<ItemSearchResponse xmlns="http://webservices.amazon.com/AWSECommerceService/2009-05-15">
<Items>
<Request>
<IsValid>True</IsValid>
<ItemSearchRequest>
<Author>Sidney Sheldon</Author>
<SearchIndex>Books</SearchIndex>
</ItemSearchRequest>
</Request>
<TotalResults>203</TotalResults>
<TotalPages>21</TotalPages>
<Item>
<ASIN>0446355453</ASIN>
<DetailPageURL> http://www.amazon.com/ </DetailPageURL>
<ItemAttributes>
<Author>Sidney Sheldon</Author>
<Manufacturer>Warner Books</Manufacturer>
<ProductGroup>Book</ProductGroup>
<Title>Master of the Game</Title>
</ItemAttributes>
</Item>
</Items>
</ItemSearchResponse>