版本:5.1.0
说在前面:多个Model通常和一个Store配合使用。Store是多个record的集合(record是model的实例)。
举个例子:Store最终是要服务于Ext的组件的,就比如多选框(combobox)和网格(grid)。那么,store是怎么给组件提供服务的呢,见代码:
1. combobox:
'use strict';
Ext.onReady(function(){
var states = Ext.create('Ext.data.Store', {
fields: [//要注意的是,Store的会根据fields里的元素自动创建Model。
//fields可以为空,Ext会根据数据的字段名,自行创建model
// 'abbr', 'name'
],
data : [//准备的内联数据,可以内联,也可以请求获取,这里只做一个例子。
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
//...
]
});
//上方的Store会根据fields创建一个类似这样的model
Ext.define('MyComboModel', {
extend: 'Ext.data.Model',
fields: [ //fields可以为空,但实例化的时候要写明
// {name: 'abbr', type: 'string'},
// {name: 'name', type: 'string'}
]
});
Ext.create('Ext.window.Window', {
title: 'Hello',
height: 200,
width: 400,
layout: 'fit',
items:[
{
xtype:'form',
items:[
{
xtype:'combobox',
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
id:'mycombo'
},{
xtype:'button',
text:'点击',
handler:function(){
console.log('nmsl');
// var curType = Ext.create('MyComboModel', {
// abbr : 'CS',
// name:'长沙'
// });
var curType = new MyComboModel({
'abbr':'CS',
'name':'长沙'
});
// Ext.getCmp('button').
Ext.getCmp('mycombo').setSelection(curType);
}
}
]
}
]
}).show();
});