Dojo 基础入门(四)

前端之家收集整理的这篇文章主要介绍了Dojo 基础入门(四)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1. 数据

1.1. 了解dojo.data

dojo.data提供了封装的标准的数据存取API,作为统一的数据访问层而存在。所有的数据都是item或者item属性Dojo.data提供了一个基本的ItemFileReadStore类来读取JSON格式数据,而dojox提供了更多扩展,比如XmlStore, CsvStore,OpmlStore等,我们也可以自定义自己的store类型。

dojo.data的操作都是异步的,可以不刷新页面而取回数据。

1.2. dojo.data的一些术语与传统数据库的对比

dojo.data

传统数据库

备注

data source

数据库

datastore

item

行记录

attribute

reference

有些类似外键依赖,但外键指向的父记录,而reference指向子记录的列表

identity

主键

query

Where条件子句

从目前看,语法不如Where条件子句丰富,只支持and不支持or

1.3. JSON

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于Javascript标准的一个子集,JavaScriptd@H_929_404@的数据结构(如字符串、数组、对象)的表示方式恰好与JSON相同,所以JSON可以被Javascript无损的识别。@H_929_404@它是一种简单文本格式,与XML相比,它更加易读、更少的数据冗余。

@H_929_404@一段典型的JSON格式数据形如:

{ identifier: 'name',
items: [
{ name: 'Adobo',aisle: 'Mexican' },
{ name: 'Balsamic vinegar',aisle: 'Condiments' },
{ name: 'Basil',aisle: 'Spices' },
{ name: 'Bay leaf',
{ name: 'Beef Bouillon Granules',aisle: 'Soup' },
{ name: 'Vinegar',
{ name: 'White cooking wine',
{ name: 'Worcestershire Sauce',aisle: 'Condiments' }]

}

假设该段数据存放于pantry_spices.json文件相应的Dojo datastore的声明和使用如下:

<div dojoType="dojo.data.ItemFileReadStore" jsId="pantryStore"
url="pantry_items.json"></div><!-(1)-->
<div
name="pantry_item" dojoType="dijit.form.FilteringSelect"
store="pantryStore"
searchAttr="name" value="Vinegar" autoComplete="true"
></div><!-(2)-->

(1) 指明了datastore的类型是dojo.data.ItemFileReadStore;数据的url,请注意这里除了可以是文件路径,也可以是一段请求得到的流;以及该datastorejsId

(2) 这里声明了dojoTypedijit.form.FilteringSelect的一个组件,该组件在html页面上展现形式为一个下拉框,需要有数据填充,其中store属性指向了jsIdpantryStore的一个datastore,由此把刚刚在(1)处定义的datastore的数据关联了起来。

1.4. datastore的读取

var pantryStore = new dojo.data.ItemFileReadStore({url: "pantry_items.json" } ); //(1)

var gotList = function(items,request){ //(2)
var itemsList = "";
for (var i = 0; i < items.length; i++){
itemsList += pantryStore .getValue(items[i],"name") + " "; //(3)
}
alert("All items are: " + itemsList);
}
var gotError = function(error,request){ //(4)
alert("The request to the store Failed. " + error);
}

pantryStore.fetch({onComplete: gotList,onError: gotError,query:{name:”*”}}); //(5)

(1) 此处用编程实现方式定义了一个datastore,在这里是dojo.data.ItemFileReadStore,其实还可以是其它的datastore类型,如XmlStore,CsvStore等,甚至可以是自定义datastore类型。

(2) 自定义函数,为fetch函数做准备,用于数据处理。

(3) getValue函数,它是由dojo.data封装的API,用于得到某个item的某个属性名称的值。具体可参考Dojo API说明。

(4) 自定义函数,为fetch函数做准备,用于异常处理。

(5) 执行数据查询的语句,需要传入一些查询选项,比如在示例中出现的:

onComplete:在得到所有符合条件的数据后的处理函数,参数为item的列表;

onError:出现异常的处理函数

query: 查询条件,是一个Object类型,形如{ name: '?hite*',aisle: 'Condiments' },”,”表示条件的and关系,通配”?”,”*”表示一个或多个字符(包含0个);

此外,还有
queryOptions:
查询选项,指明是否忽略大小写或是否深度查找item的子;
onBegin:
查询前的处理函数
onItem:
在遇到符合条件的每一个item时的处理函数
等。

还有一些其他的选项,具体可参考Dojo API说明。

猜你在找的Dojo相关文章