您的位置:首页 > Web前端 > JavaScript

ExtJS学习04Store

2014-06-10 08:58 267 查看
store是一个存储数据对象Model的集合缓存,他可以为extjs的可视化组建提供数据(GridPanel,ComboBox)等

类结构

Ext.data.AbstractStore

    Ext.data.Store  没有特殊情况这个类就可以满足日常的开发了

        Ext.data.ArrayStore

        Ext.data.DirectStore

        Ext.data.ArrayStore  内置辅助的类

        Ext.data.JsonStroe       内置辅助的类

    Ext.data.TreeStore

    

    

    

Ext.data.Store 使用

    参数

      autoLoad(Boolean/Object) : 自动加载数据,自动调用load

      data(Array) : 内置数据对象的数组,初始化的是就要被装在

      model(Model): 数据集合相关的模型

      fields(Field):字段的集合,程序会自动生成对于的Model

    方法

      each( Function f, [Object scope] ) : void 变量数据中的Model

 ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------

例子小程序1:

(function(){
Ext.Loader.setConfig({ //启用Ext.Loader
enabled:true,
});

Ext.onReady(function(){
Ext.define("person",{ //创建一个类
extend:'Ext.data.Model',
fields:[
{name:'name'},
{name:'age'}
],
proxy:{ //内存代理
type:'memory'
}
})
var s=new Ext.data.Store({ //创建store

data:[ //data属性,创建数据
{name:'uspcat.com',age:1},
{name:'yfc',age:26},
],
model:'person', //model属性,指定和person类相关联
autoLoad:true //自动加载
});

s.each(function(model){
alert(model.get('name'));
});
})

})();

例子小程序2:不要模型类,直接在Store中创建字段即可

(function(){
Ext.Loader.setConfig({ //启用Ext.Loader
enabled:true,
});

Ext.onReady(function(){
Ext.define("person",{ //创建一个类
extend:'Ext.data.Model',
fields:[
{name:'name'},
{name:'age'}
],
proxy:{ //内存代理
type:'memory'
}
})
var s=new Ext.data.Store({ //创建store

data:[ //data属性,创建数据
{name:'uspcat.com',age:1},
{name:'yfc',age:26},
],
model:'person', //model属性,指定和person类相关联
autoLoad:true //自动加载
});

s.each(function(model){
alert(model.get('name'));
});
})

})();
 

<span style="font-size:14px;"><strong>例子小程序3:</strong></span>
用一个代理类:替代类来传递数值

(function(){
Ext.Loader.setConfig({ //启用Ext。Loader
enabled:true,
});
Ext.onReady(function(){
var s=new Ext.data.Store({ //创建store
fields:[
{name:'name'},
{name:'age'}
],
proxy:{ //通过代理传递参数
type:'ajax',
url:'person.jsp'
},
model:'person', //model属性,指定和person类相关联
// autoLoad:true //自动加载

});
s.load(function(records,operation,success){
Ext.Array.each(records,function(model){
alert(model.get('name'));

});
});
})

})();
//总结:当用内存代理时,我们用autoLoad:true 自动加载
//当用ajax传递数据的时候,需要用load方法加载。

<span style="font-size:14px;"><strong>例子小程序4:</strong></span>
filter的用法:
(function(){
Ext.Loader.setConfig({              //启用Ext。Loader
enabled:true,
});
Ext.onReady(function(){
var s=new Ext.data.Store({         //创建store
fields:[
{name:'name'},
{name:'age'}
],
proxy:{            //通过代理传递参数
type:'ajax',
url:'person.jsp'
},
model:'person',          //model属性,指定和person类相关联

});
s.load(function(records,operation,success){
Ext.Array.each(records,function(model){
});
s.filter('name',"yfc");          //过滤
s.each(function(model){
alert(model.get('name'));
});

var index=s.find('name','uspcat\.com',0,false,true,false);
alert(index);

});
})

})();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: