Fields are used to define what a Model is. They aren't instantiated directly - instead, when we create a class that extendsExt.data.Model, it will automatically create a Field instance for each field configured in a Model. For example, we might set up a model like this:

字段用于定义model是什么。它们不会被直接实例化--做为替代,我们创建model类,它们会根据field配置项自动创建每个字段的实例。例如,我们建立下面的model:

Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
'name', 'email',
{name: 'age', type: 'int'},
{name: 'gender', type: 'string', defaultValue: 'Unknown'}
]
});

Four fields will have been created for the User Model - name, email, age and gender. Note that we specified a couple of different formats here; if we only pass in the string name of the field (as with name and email), the field is set up with the 'auto' type. It's as if we'd done this instead:

为会user模型创建四个字段--name、email、age、gender。注意,这里我们指定了一对不同的格式。如果我们仅仅传入字段的名称(对于name和email),字段会被创建为auto类型。就像我们这样做:

Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', type: 'auto'},
{name: 'email', type: 'auto'},
{name: 'age', type: 'int'},
{name: 'gender', type: 'string', defaultValue: 'Unknown'}
]
});

Types and conversion   类型和转换

The type is important - it's used to automatically convert data passed to the field into the correct format. In our example above, the name and email fields used the 'auto' type and will just accept anything that is passed into them. The 'age' field had an 'int' type however, so if we passed 25.4 this would be rounded to 25.

类型很重要--它对传给field的数据使用自动转换,转换为正确的格式。在上面的例子中,name和email字段使用auto类型,并将介绍任何传给它们的值。然而,age字段是int类型,因此,如果我们穿25.4给它,会被自动四舍五入为25.

Sometimes a simple type isn't enough, or we want to perform some processing when we load a Field's data. We can do this using a convert function. Here, we're going to create a new field based on another:

有时,一个简单的类型是不够的,或者我们希望在加载数据的时候执行一些处理。我们可以使用convert函数做到这点。这里,我们将创建一个基于其它字段的新字段:

Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{
name: 'firstName',
convert: function(value, record) {
var fullName = record.get('name'),
splits = fullName.split(" "),
firstName = splits[0]; return firstName;
}
},
'name', 'email',
{name: 'age', type: 'int'},
{name: 'gender', type: 'string', defaultValue: 'Unknown'}
]
});

Now when we create a new User, the firstName is populated automatically based on the name:

现在,当我们创建一个新user,firstName会基于name自动生成:

var ed = Ext.create('User', {name: 'Ed Spencer'});

console.log(ed.get('firstName')); //logs 'Ed', based on our convert function

Fields which are configured with a custom convert function are read after all other fields when constructing and reading records, so that if convert functions rely on other, non-converted fields (as in this example), they can be sure of those fields being present.

具有自定义convert函数配置的自动,会在其它字段之后被构造和读取。

In fact, if we log out all of the data inside ed, we'll see this:

事实上,如果我们log输出所有ed中的数据,我们会看到:

console.log(ed.data);

//outputs this:
{
age: 0,
email: "",
firstName: "Ed",
gender: "Unknown",
name: "Ed Spencer"
}

The age field has been given a default of zero because we made it an int type. As an auto field, email has defaulted to an empty string. When we registered the User model we set gender's defaultValue to 'Unknown' so we see that now. Let's correct that and satisfy ourselves that the types work as we expect:

age自动被赋予了一个为0的缺省值,因为它们是int类型。作为一个auto字段,email的缺省值是一个空字符串。当我们注册usermodel,gender的缺省值设为’Unknown'。让我们修正这个值,以使其如我们期望的来工作:

ed.set('gender', 'Male');
ed.get('gender'); //returns 'Male' ed.set('age', 25.4);
ed.get('age'); //returns 25 - we wanted an int, not a float, so no decimal places allowed

ExtJS笔记 Field的更多相关文章

  1. extjs笔记

      1.    ExtJs 结构树.. 2 2.    对ExtJs的态度.. 3 3.    Ext.form概述.. 4 4.    Ext.TabPanel篇.. 5 5.    Functio ...

  2. ExtJS笔记 Tree

    The Tree Panel Component is one of the most versatile Components in Ext JS and is an excellent tool ...

  3. ExtJs之Field.Trigger和Field.Spinner

    作文本框功能的. <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta h ...

  4. ExtJS笔记 Ext.data.Types

    This is a static class containing the system-supplied data types which may be given to a Field. Type ...

  5. ExtJS笔记 Ext.data.Model

    A Model represents some object that your application manages. For example, one might define a Model ...

  6. ExtJS笔记 Grids

    参考:http://blog.csdn.net/zhangxin09/article/details/6885175 The Grid Panel is one of the centerpieces ...

  7. ExtJS笔记 Form

    A Form Panel is nothing more than a basic Panel with form handling abilities added. Form Panels can ...

  8. ExtJS笔记 Using Events

    Using Events The Components and Classes of Ext JS fire a broad range of events at various points in ...

  9. ExtJS笔记5 Components

    参考 :http://blog.csdn.net/zhangxin09/article/details/6914882 An Ext JS application's UI is made up of ...

随机推荐

  1. MySql连接数据库和操作(java)

    package org.wxd.weixin.util; import java.sql.Connection;import java.sql.DriverManager;import java.sq ...

  2. python运算符

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAHCCAIAAADzel4SAAAgAElEQVR4Aey9+bMcSXLnV1dmna/ejR

  3. Excel 导出

    admin = Context.Request.Cookies["user"].Values["username"].ToString();           ...

  4. macbook air 开机黑屏解决方法

    故障现象:1. 开机有声音2. 背面logo亮灯3. 键盘背光灯不亮4. 大写锁定键按下不亮5. 屏幕黑屏,无苹果logo 解决:重置PRAM后成功开机. 1. 关闭 Mac.2. 在键盘上找到以下按 ...

  5. angularjs---select使用---默认值及联动

    angularjs---select使用---默认值及联动   代码 一. select设置默认显示内容&&获取下拉框显示内容. HTML <div> <select ...

  6. 与你相遇好幸运,Settings

    IDE-Java-Setting && IDE-Nodejs-Setting  Download

  7. Ubuntu 配置有线网 IP

    方法1: 最直接的办法,就是在右上端的网络那里点设置,然后add,选以太网,然后IPV4里,手动设置 -- add IP -- 填入IP地址.网关.子网掩码,OK. 方法2,3见网上教程: Ubunt ...

  8. 3.OGG函数

    1.COMPUTE     一般用来计算目标端和源段的字段值,使用这个函数计算出目标端对应列想要的值 Use the @COMPUTE function to return the value of ...

  9. SQL SERVER 中的提示

    提示是指定的强制选项或策略,由 SQL Server 查询处理器针对 SELECT.INSERT.UPDATE 或 DELETE 语句执行. 提示将覆盖查询优化器可能为查询选择的任何执行计划. 注意: ...

  10. html基本知识点

    <hr />定义下划线 <br/>定义换行<p>段落</p> <h1>标题</h1>h后的数字逐渐增大,字体逐渐减小;<h ...