`
decentway
  • 浏览: 159178 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

YUI3:DataSchema

阅读更多

DataSchema Utility 应用一个给定的模式 ,以任意格式的数据,标准化输入(例如JSON,XML,或者是分隔的文本)为一个JavaScript对象。DataSchema工具的作用是通过组建,在一种可预测的方式下,将各种各样的数据转换成一个固定的格式以便使用。

使用DataSchema工具

DataSchema basics

DataSchema.Array

DataSchema.JSON

DataSchema.XML

DataSchema.Text

DataSchema 作为一个DataSouce插件

DataSchema basics

 DataSchema classes 是一个独立的静态工具,它接受数据输入,再定义一个输出模式,就可以返回一个带有以下属性的JavaScript对象。(即:最后的返回结果一般为:{results=>[],meta=>{}})

PROPERTY TYPE DESCRIPTION
results 数组 数据数组
meta 对象 从输入数据中过滤出来的任意数据值。

你定义的模式依赖于你使用的DataSchema的子类(前面说的Array,JSON,XML,Text)

 

DataSchema.Array

当working with JavaScript数组时,使用DataSchema

三种情况:JavaScript对象,数组,primitive values(基本值?)

// A sample array of objects
[
    {make:"Chevrolet",model:"Bel Air",year:1957},
    {make:"Dodge",model:"Dart",year:1964},
    {make:"Ford",model:"Mustang",year:1968}
];

// A sample array of arrays
[
    ["Chevrolet", "Bel Air", 1957],
    ["Dodge", "Dart", 1964],
    ["Ford", "Mustang", 1968]
];

// A sample array of primitives
[
    "1957 Chevrolet Bel Air", "1964 Dodge Dart", "1968 Ford Mustang"
];

 

而模式的定义用的是下面的属性。

PROPERTY TYPE DESCRIPTION
resultsField 数组 包含在数组中,制定到特定值的keys

 

var mySchema = {
        resultFields: [{key:"make"}, {key:"model"}, {key:"year"}]
};

// Returns an object with the properties "results" and "meta"
var myOutput = Y.DataSchema.Array.apply(mySchema, myData)); 

DataSchema.JSON

当working with JavaScript object 或者JSON data时使用DataSchema.JSON.Typically, your data will hold meta values as well as an internal array of tabular data.(这句话如何理解??)

// Sample JSON data
{
    "profile":{
        "current":160,
        "target":150
    },
    "program": [
        {
            "category":"exercise",
            "weekly schedule":[
                {"day":"sunday", "activity":"swimming"},
                {"day":"monday", "activity":"running"},
                {"day":"tuesday", "activity":"biking"},
                {"day":"wednesday", "activity":"running"},
                {"day":"thursday", "activity":"swimming"},
                {"day":"friday", "activity":"running"},
                {"day":"saturday", "activity":"golf"}
            ]
        }
    ]
};

 

PROPERTY TYPE DESCRIPTION
metaFields Object Key/locator pairs that point to arbitrary data values.
resultListLocator String Locator to an internal array of tabular data.
resultFields Array Keys to assign to the values contained in the array.

var mySchema = {
    metaFields: {current:"profile.current", target:"profile.target"},
    resultListLocator: "program[0]['weekly schedule']",
    resultFields: [{key:"day"}, {key:"activity"}]
};

// Returns an object with the properties "results" and "meta"
var myOutput = Y.DataSchema.JSON.apply(mySchema, myData));

 

DataSchema.XML

注意,这部分在android 浏览器上会出现问题。

当working with XML数据时使用DataSchema.JSON.

DataSchema.Text

DataSchema 作为一个DataSouce插件

分享到:
评论

相关推荐

    JavaScript YUI 2.8: DataTable jquery form 异步请求显示数据分页

    JavaScript YUI 2.8 和 DataTable 是 Yahoo! UI Library 的一部分,它提供了一种强大的方式来展示和操作表格数据。jQuery form 插件则用于处理表单的异步提交,通常用于实现无刷新的数据更新。在本文中,我们将深入...

    yui3-master.zip

    《深入理解YUI3:基于yui3-master.zip的探讨》 YUI(Yahoo! User Interface Library)是由雅虎公司开发的一套开源JavaScript库,它为Web开发者提供了丰富的功能和工具,以创建交互性强、性能优秀的网页应用。YUI3是...

    generator-yui3:YUI3项目脚手架

    (尚未稳定)YUI3项目的Yeoman发电机安装sudo npm install -g generator-yui3建立专案yo yui3 awesomeProject.generator-yui3.json 允许您覆盖默认配置{ "project" : "awesomeProject", "lang" : ["fr", "en", "es",...

    yui_2.9.0用于javascript基础教程

    适合图灵程序设计丛书web开发系列-javascript基础教程的学习使用

    YUI3 中tree的两种实现

    这篇博文“YUI3 中tree的两种实现”探讨了如何在YUI3中创建和管理树形结构。 1. **YUI3 TreeView组件** YUI3 TreeView组件是YUI3核心库的一部分,它允许开发者创建交互式的树结构。这个组件支持节点的添加、删除、...

    yui_2.9.0前端UI

    YUI 库,全称Yahoo! UI Library。是一组工具和控件,用JavaScript写成, 为的是用DOM 脚本,DHTML和AJAX等技术创建丰富的网页交互式应用程序。 YUI 基于BSD协议,对所有的使用方式都是免费的。YUI 项目包括YUI 库和两...

    YUI类库2.9.0下载download

    YUI 2 is a JavaScript and CSS library with more than 30 unique components including low-level DOM utilities and high-level user-interface widgets. Currently at version 2.9.0, YUI 2 is robust, proven, ...

    YUI3 dialog组件

    **YUI3 Dialog组件详解** YUI3是Yahoo!推出的一款强大的JavaScript库,它提供了丰富的UI组件和工具,用于构建高性能、跨平台的Web应用程序。Dialog组件是YUI3中的一个重要部分,它允许开发者创建可交互的弹出窗口,...

    yui2.9

    3. **数据管理**:YUI 2.9提供了DataSource组件,用于处理数据请求、缓存和格式化。配合Connection Manager,可以实现与服务器的数据交换,支持JSON、XML等多种数据格式。 4. **国际化与本地化**:YUI 2.9支持多...

    yui 资源包

    3. **事件处理**:YUI的事件系统强大,支持事件绑定、解绑、事件冒泡等,使得用户交互编程简单易行。 4. **动画效果**:通过Transition和Anim模块,可以轻松实现平滑的CSS3动画和JavaScript动画效果。 5. **数据绑定...

    yui3-3.17.2最新版

    在实际使用YUI 3.17.2时,开发者可以通过`yui3-3.17.2`这个压缩包文件获取所有必要的资源。这个压缩包中包含了库的源码、示例、文档和其他辅助工具。开发者可以按照项目需求,选择合适的模块和组件进行集成。 在...

    yuitest:YUI测试

    YUITest JavaScript测试库 建造 要构建JavaScript文件,请在javascript目录中运行此文件: ant all 构建一个NPM软件包 要构建npm软件包(输出到javascript / build / yuitest / npm),请在javascript目录中运行此...

    YUI 入门教程YUI 入门教程YUI 入门教程

    YUI,全称为Yahoo! User Interface Library,是一个开源的JavaScript库,主要用于构建富互联网应用程序(RIA)。本教程将深入介绍YUI的基础知识和关键特性,帮助开发者快速入门。 首先,YUI提供了一系列强大的DOM...

    YUI3.6文档及示例

    1. **模块系统**:YUI3引入了模块化设计,允许开发者按需加载组件,降低页面的初始化时间。模块可以通过`YUI.use()`方法来加载,实现了代码的异步加载和依赖管理。 2. **事件系统**:YUI的事件处理机制强大且灵活,...

    从YUI2到YUI3看前端的演变

    从YUI2到YUI3看前端的演变

    YUI3.7.3 最新版本 带API

    1. **模块系统**:YUI3引入了CommonJS风格的模块系统,允许开发者通过`YUI.use()`方法加载所需模块,实现按需加载,减少页面初始化时的加载量。 2. **事件处理**:YUI3提供了强大的事件系统,支持DOM事件、自定义...

    从YUI2到YUI3看前端的演变 pdf

    YUI3 引入了粒度更细的模块管理方式,通过异步 HTTP 请求加载模块、然后执行回调来加载和使用模块。现场有很多人提出疑问,大家无非关心的是“效率”二字。个人以为在现阶段,这种方式有一点激进,否能为广大用户所...

    YAHOO yui2.7 文档+ 代码+例子

    同时,YUI的后续版本(如YUI 3)引入了更多改进和新特性,保持了YUI在前端开发领域的竞争力。 总之,YUI 2.7作为一个成熟的JavaScript框架,为开发者提供了强大的工具集,帮助他们高效地构建现代Web应用。其丰富的...

    yui3.10.3最新版

    YUI 3是YUI库的第三个主要版本,与之前的版本相比,它进行了彻底的重构,更加模块化,易于定制和扩展。它遵循CommonJS规范,允许开发者按需加载所需的功能,从而减少了页面加载时间。YUI 3的核心组件包括事件处理、...

Global site tag (gtag.js) - Google Analytics