1

我有一个从 web 服务读取数据的 JSON 存储。来自网络服务的 JSON 是有效的（我尝试直接从文件中读取数据并且它正在工作）。

这是 JSON 数据：

{
"type": "FeatureCollection",
"name": "Points",
"keyField": "GPSUserName",
"features": [
    {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [
                35.19999,
                31.780965
            ]
        },
        "properties": {
            "GPSId": "<img src=images/battery3.png />",
            "DateTime": "12/07/2013 09:05:00",
            "GPSUserName": "13",
            "GPSUserColor": "#00FF57",
            "GPSUserIcon": "marker_red2.png",
            "GPSLabelPosX": "6",
            "GPSLabelPosY": "7"
        }
    },
    {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [
                35.201142,
                31.780699
            ]
        },
        "properties": {
            "GPSId": "<img src=images/battery4.png />",
            "DateTime": "12/07/2013 09:05:00",
            "GPSUserName": "14",
            "GPSUserColor": "#00FF57",
            "GPSUserIcon": "marker_red2.png",
            "GPSLabelPosX": "6",
            "GPSLabelPosY": "7"
        }
    }
]

}

使用以下商店时，一切正常：

 initComponent: function () {

    this.store = new Ext.data.JsonStore({
        storeId: 'usersStore',
        autoLoad: true,
        autoSync: false,
        proxy: {
            type: 'ajax',
            url: 'data/users.json',
            reader: {
                type: 'json',
                root: 'features'
            }
        },
        fields: [
            { name: 'name', mapping: 'properties.GPSUserName'},
            { name: 'date', mapping: 'properties.DateTime' },
            { name: 'battery', mapping: 'properties.GPSId' }
        ]
    });

    this.columns = [
        { header: 'name', dataIndex: 'name', flex: 1 },
        { header: 'date', dataIndex: 'date', flex: 3 },
        { header: 'battery', dataIndex: 'battery', flex: 1 }
    ];

    this.callParent(arguments);
}

但是当我更改为使用网络服务（返回文件内容）时，没有任何效果：

 initComponent: function () {

    this.store = new Ext.data.JsonStore({
        storeId: 'usersStore',
        autoLoad: true,
        autoSync: false,
        proxy: new Ext.data.HttpProxy({
            url: 'service.asmx/GetJson',
            headers: { 'Content-Type': 'application/json; charset=utf-8;' },
            reader: { root: 'd', record: 'features' }
        }),  

        fields: [
            { name: 'name', mapping: 'properties.GPSUserName'},
            { name: 'date', mapping: 'properties.DateTime' },
            { name: 'battery', mapping: 'properties.GPSId' }
        ]
    });                  

    this.callParent(arguments);
}

这是网络服务：

[WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)]
    public string GetJson()
    {
        string res = File.ReadAllText("data\users.json");
        return res;
        /*HttpContext.Current.Response.Clear();
        HttpContext.Current.Response.ContentType = "application/json";
        HttpContext.Current.Response.Charset = "utf-8";
        HttpContext.Current.Response.Write(res);*/
    }

在萤火虫中，我看到来自调用的以下返回： 在此处输入图像描述

所以......我在这里错过了什么？

4

1 回答 1

0

您缺少的是JsonStoreExtJS 4.2 中 ExtJS 的错误实现。如果你查看这个类的源代码，你会发现它忽略了你的代理配置：

Ext.define('Ext.data.JsonStore',  {
    extend: 'Ext.data.Store',
    alias: 'store.json',
    requires: [
        'Ext.data.proxy.Ajax',
        'Ext.data.reader.Json',
        'Ext.data.writer.Json'
    ],

    constructor: function(config) {
        config = Ext.apply({
            proxy: {
                type  : 'ajax',
                reader: 'json',
                writer: 'json'
            }
        }, config);
        this.callParent([config]);
    }
});

只需使用Ext.data.Store类，一切都应该找到。在弄清楚这一点之前，花了很多时间。

于 2014-01-17T22:59:32.947 回答