ExtJs中关于grid和store的应用分析（三）

第三部分：解析器与数据的关系


一、XmlReader的构造方法定义如下：

XmlReader( Object meta, Object recordType )

二、JsonReader的构造方法定义如下：

JsonReader( Object meta, Object recordType ) 

三、ArrayReader的构造方法定义如下：

ArrayReader( Object meta, Object recordType ) 

都表示实例化这些解析器时，需要传递2个参数，一个是meta,一个是recordType。
但是不同的解析器他们需要的meta的值为不同的。只需看各自的Config Options（即配置选项）。也就是说，meta是由配置选项组成的。而recordType是指通过Recorde.create方法得到的数据结构的定义。一般也可以为var fields = ["id","name","email","sex","age"];这样定义的fields。

一、XmlReader所接受的配置选项有：

id:
其值是作为数据唯一标志的字符串,必须为fields中某列的name值。如：id:"id"，也可以是id:"name"，但是这个时候，字段name的值要确保是能唯一标志数据的。
record:
其值为可以指定数据的字符串。如：record:"row"
success:
totalRecords:
其值为可以指定数据总数的字符串。如：totalRecords:"total"

二、JsonReader所接受的配置选项有：

id:
同XmlReader
root:
其值为可以指定数据的字符串。如：root:"result"
successProperty:
totalProperty:
其值为可以指定数据总数的字符串。如：totalProperty:"total"

三、ArrayReader所接受的配置选项有：

id:
同XmlReader

现在再来看一下解析器与数据的关系。
数据只要满足了解析器的要求，那么数据就能获取成功。什么叫满足解析器的要求呢？有两种方式均可满足解析器的要求。
第一种：给予的数据不包含metaData
第二种：给予的数据包含了metaData

ArrayReader和XmlReader需要的数据是没有metaData的，此时给予的数据需要包含以下内容：
1、ArrayReader:
比如ArrayReader如下定义：
var fields = ["id","name","email","sex","age"];
var reader = new Ext.data.ArrayReader({
  id:"id"
},fields);

给予的数据应该如下：

[[
	"1","langsin1","[e-mail]","0","20"
],[
	"2","langsin2","[e-mail]","1","21"
],[
	"3","langsin3","[e-mail]","0","22"
],[
	"4","langsin4","[e-mail]","1","23"
],[
	"5","langsin5","[e-mail]","0","24"
]]

也就是必须为二维数组。
此时二维数组中的每列的数据顺序与fields中的字段名的定义是从左向右一一匹配，即，这里有5条数据，第一条数据是:
id的值为"1"，
name的值为"langsin1"，
email的值为"[e-mail]"，
sex的值为"0"，
age的值为"20"

2、XmlReader
比如XmlReader如下定义：
var fields = ["id","name","email","sex","age"];
var reader = new Ext.data.XmlReader({
  id:"id",
  record:"row",
  totalRecords:"results"
},fields);

给予的数据应该如下：

<?xml version="1.0" encoding="utf-8"?>
<dataset>
	<results>2</results>
	<row>
		<id>1</id>
		<name>langsin1</name>
		<email>[e-mail]</email>
		<sex>0</sex>
		<age>20</age>
	</row>
	<row>
		<id>2</id>
		<name>langsin2</name>
		<email>[e-mail]</email>
		<sex>1</sex>
		<age>21</age>
	</row>
	<row>
		<id>3</id>
		<name>langsin3</name>
		<email>[e-mail]</email>
		<sex>0</sex>
		<age>22</age>
	</row>
	<row>
		<id>4</id>
		<name>langsin4</name>
		<email>[e-mail]</email>
		<sex>1</sex>
		<age>23</age>
	</row>
	<row>
		<id>5</id>
		<name>langsin5</name>
		<email>[e-mail]</email>
		<sex>0</sex>
		<age>24</age>
	</row>
</dataset>

这里dataset标签可以换车其他任何字母组成的标签，如aaa，不会影响最后数据的读取。
但是这个dataset标签对里就必须要有1个或多个的results和row标签对。

现在再来看下JsonReader。
JsonReader可以用第一种也可以用第二种的数据给予方式。
1、给予的数据不包含metaData的情况时：
比如JsonReader如下定义：
var fields = ["id","name","email","sex","age"];
var reader = new Ext.data.JsonReader({
  id:"id",
  root:"result",
  totalProperty:"total"
},fields);

给予的数据应该如下：

{
	total:5,
	result:[{
		id:"1",
		name:"langsin1",
		email:"[e-mail]",
		sex:"0",
		age:"20"
	},{
		id:"2",
		name:"langsin2",
		email:"[e-mail]",
		sex:"1",
		age:"21"
	},{
		id:"3",
		name:"langsin3",
		email:"[e-mail]",
		sex:"0",
		age:"22"
	},{
		id:"4",
		name:"langsin4",
		email:"[e-mail]",
		sex:"1",
		age:"23"
	},{
		id:"5",
		name:"langsin5",
		email:"[e-mail]",
		sex:"0",
		age:"24"
	}]
}

如果定义时不包含root配置选项时，那么给予的数据应该如下：

[{
	id:"1",
	name:"langsin1",
	email:"[e-mail]",
	sex:"0",
	age:"20"
},{
	id:"2",
	name:"langsin2",
	email:"[e-mail]",
	sex:"1",
	age:"21"
},{
	id:"3",
	name:"langsin3",
	email:"[e-mail]",
	sex:"0",
	age:"22"
},{
	id:"4",
	name:"langsin4",
	email:"[e-mail]",
	sex:"1",
	age:"23"
},{
	id:"5",
	name:"langsin5",
	email:"[e-mail]",
	sex:"0",
	age:"24"
}]

2、给予的数据包含metaData的情况时：
比如JsonReader如下定义：
var reader = new Ext.data.JsonReader({
  id:"id",
},fields);

给予的数据应该如下：

{
	metaData:{
		fields:["id","name","email","sex","age"],
		root:"result"
	},
	result : [{
		id : "1",
		name : "langsin1",
		email : "[e-mail]",
		sex : "0",
		age : "20"
	}, {
		id : "2",
		name : "langsin2",
		email : "[e-mail]",
		sex : "1",
		age : "21"
	}, {
		id : "3",
		name : "langsin3",
		email : "[e-mail]",
		sex : "0",
		age : "22"
	}, {
		id : "4",
		name : "langsin4",
		email : "[e-mail]",
		sex : "1",
		age : "23"
	}, {
		id : "5",
		name : "langsin5",
		email : "[e-mail]",
		sex : "0",
		age : "24"
	}]
}

这里将root和fields等都转移到了给予的数据的metaData中。

评论

3 楼 hvang1988 2009-07-16  

需要资料可以在google中搜索啊

2 楼 kejiangwei 2009-01-06  

刚学Ext，拜读之后，受益匪浅，谢谢！

1 楼 yiminghe 2008-09-24  

能分析一下

loadMask 与 gridpanel  源码实现么