Extjs 存储字段操作答案

【问题标题】：Extjs Store field manipulationExtjs 存储字段操作
【发布时间】：2011-07-22 21:50:08
【问题描述】：

我正在尝试建立一个商店，它将根据来自服务器的数据生成一个模型例如：

{success:true,data:[item1:{},item2{}...]}

有什么办法可以改写商店的模型吗？

这是我的自动取款机：

Ext.define('Tan.data.SimpleStore', {
extend: 'Ext.data.Store',
constructor: function (config) { //Not initComponent, thx for wasting an hour...
    config=this.config||{};
    Ext.define('Users', { //ext base example model.
        extend: 'Ext.data.Model',
        fields: [
            {name: 'id', type: 'string'},
        ]
    });
    config.proxy= { 
        type: 'ajax',
        url : 'server.php?c=testFunction',
        reader: {
            type: 'json',
            root: 'data'
    }//Example return: {"success":true,"data":["0":1,"2":1,"3":1,"4":1]}

    }
    config.model='Users';//Store breaks without this :((
    this.callParent([config]); //Proto It
    this.load({ // watch for the load event and then manipulate
                    // ( or try to atleast ) the fields
        callback: function(records,operation,success){
 // As expected obj is correct
            var obj=Ext.decode(operation.response.responseText);     
 //K now wtf. Have the data but....
            Ext.ModelManager.unregister(this.config.model);

            Ext.define(this.config.model, {
                extend: 'Ext.data.Model'
                ,fields: Ext.Object.getKeys(obj.data)
                ,url : 'server.php?c=testFunction'
                ,reader: {
                    type: 'json',
                    root: 'data'
                }
            });//yay you over wrote the model, but meh, nothing
            console.log(this); //Bleh 0 items in store.data
        }
    });
}
});

var s= Ext.create('Tan.data.SimpleStore');
s.load();

似乎在加载商店时必须声明一个模型，所以我只是声明一个粗略的模型，并打算重写它。

理论上我认为它可以通过在 ext.Ajax 调用上作为构造函数进行回调来工作，但我试图避免它。

【问题讨论】：

标签： extjs store

【解决方案1】：

您可以定义自己的阅读器或覆盖Reader.read 方法。

我在post 中解决了类似的问题。

【讨论】：

【解决方案2】：

这非常简单。

this.add({key:'value});

注册字段。

Ext.define('Tan.data.SimpleStore', {
extend: 'Ext.data.Store',
constructor: function (config) {
    config=this.config||{};
    Ext.define('Users', {
        extend: 'Ext.data.Model',
        fields: [
        ]
    });
    config.proxy= {
        type: 'ajax',
        url : 'server.php',
        reader: {
            type: 'json',
            root: 'users'
    }
    }
    config.model='Users';
    this.callParent([config]);
    this.load({
        callback: function(records,operation,success){
            var obj=Ext.decode(operation.response.responseText);     
            this.add({data:obj}) //this is the magic
            console.log(this.getRange());
              console.log(this.max('data'));//yay it logs my array, looks like the handlers are in place
        }
    });
}
});

var s=   Ext.create('Tan.data.SimpleStore');
s.load();

【讨论】：

【解决方案3】：

我在Sencha's forums 中提出了类似的问题，但没有得到回复。

对不起，我没有直接回答你。

【讨论】：

迄今为止我对图表的最佳结果是根据商店 onload 事件重新创建整个对象。有点hacky，但它允许更多的可定制性（例如动态最小值/最大值等）。改变图表的配置（甚至到重新定义商店和模型的程度），应该不会那么痛苦。