如何解析extjs代理的响应?

时间:2016-05-31 14:02:34

标签: javascript json extjs extjs-chart

我收到一个json对象作为来自webservice的响应,其格式类似于: -

      {
         studentData:[
            {
                "history":25,
                 "science":69,
                 "maths":45
            }
           ]
      }

我使用以下代码来阅读JSON: -

Ext.define('MyStore.store.dashboard.graphs.Temp', {
extend: 'Ext.data.Store',
 proxy: {
        type: 'ajax',
        url: 'abc.php', 

        headers: {
            'Content-Type': 'application/json'
        },

         reader: {
                type: 'json',
                rootProperty: 'studentData',

                listeners: {

                    exception: function(reader, response, error, eOpts) {
                        console.log('YT reader exception');
                        console.log(error.message, error);
                        console.log(response);
                    }

                }
            }

我可以解析JSON响应,以便以下列格式存储吗?

     {
         studentData:[
            {
                "subject":"History",
                 "marks":"25"    
            },
           {
                 "subject":"Maths",
                 "marks":"25"
           }
           ]
      }

我需要在 xfield 作为主题, yfield 作为标记的图表中显示这些值。 是否有一个监听器,我可以附加到代理,以便我可以根据我的要求修改存储结构?

2 个答案:

答案 0 :(得分:1)

您可以在阅读器中使用transform功能:

  

如果设置了变换函数,它将在之前调用   readRecords执行。它传递原始(反序列化)数据对象。   transform函数返回一个数据对象,可以对其进行修改   原始数据对象的版本,或全新的数据对象。   转换可以是Reader上的函数或方法名称   实例,或具有“fn”的对象密钥和可选范围'键。

答案 1 :(得分:1)

根据您使用的ExtJS版本,您可以在商店加载之前更改JSON数据。

ExtJS 4 - 您可以通过扩展Ext.data.reader.Reader来创建自己的读者类 class并覆盖getResponseData(response)并更改json并返回ResultSet。

ExtJS 5 - 您可以使用Reader类的转换功能,并可以更改响应数据对象。

    Ext.create('Ext.data.Store', {
    model: 'User',
    proxy: {
        type: 'ajax',
        url : 'users.json',
        reader: {
            type: 'json',
            transform: {
                fn: function(data) {
                    // do some manipulation of the raw data object
                    return data;
                },
        scope: this
            }
        }
    },});