Question

我正在尝试使用ExtJS构建一个非常基本的“概念证明”应用程序，但我很难过。

我想要的是两个网格从远程JSON文件中获取数据，但无论我做什么，我都会继续获取主题中的错误。

这是我的简单代码：

app.js：

Ext.Loader.setConfig({enabled:true});

Ext.application({
    name: 'GeoSniffer',
    autoCreateViewport: true,
    models: ['Location', 'Client'],    
    stores: ['Locations', 'Clients'],
});

Viewport.js

Ext.define('GeoSniffer.view.Viewport', {
    extend: 'Ext.container.Viewport',
    layout: 'fit',

    requires: [
        'GeoSniffer.view.ClientsList',
        'GeoSniffer.view.LocationsList'
    ],

    initComponent: function() {
        this.items = {
            layout: {
                type: 'hbox',
                align: 'stretch'
            },
            items: [{
                width: 250,
                xtype: 'panel',
                id: 'west-region',
                layout: {
                    type: 'vbox',
                    align: 'stretch'
                },
                items: [{
                    xtype: 'locationslist',
                    flex: 1
                },{
                    xtype: 'clientslist',
                    flex: 1             
                }]
            }]
        };

        this.callParent();
    }
});

Client.js：

Ext.define('GeoSniffer.model.client', {
    extend: 'Ext.data.Model',
    fields: [
        'ip', 
        'packetsCount', 
        'firstPacketUsec', 
        'latestPacketUsec', 
        'location', 
        'sessionsArr', 
        'currentSession'
    ]
});

Location.js：

Ext.define('GeoSniffer.model.Location', {
    extend: 'Ext.data.Model',
    fields: [
        'countryCode', 
        'countryName', 
        'region', 
        'city', 
        'postalCode', 
        'latitude', 
        'longitude', 
        'dma_code', 
        'area_code', 
        'metro_code', 
        'packetsCount', 
        'sessionsArr', 
        'currentSession', 
        'clients'
    ]
});

Clients.js：

Ext.define('GeoSniffer.store.Clients', {
    extend: 'Ext.data.Store',
    requires: 'GeoSniffer.model.Client',
    model: 'GeoSniffer.model.Client',
    autoLoad: false,
    proxy: {
        type: 'ajax',
        url: 'data/clients.json',
        reader: {
            type: 'json',
            root: 'clients_list'
        }
    }
});

Locations.js：

Ext.define('GeoSniffer.store.Locations', {
    extend: 'Ext.data.Store',
    requires: 'GeoSniffer.model.Location',
    model: 'GeoSniffer.model.Location',
    autoLoad: false,
    proxy: {
        type: 'ajax',
        url: 'data/locations.json',
        reader: {
            type: 'json',
            root: 'locations_list'
        }
    }
});

ClientsList.js：

Ext.define('GeoSbiffer.view.ClientsList', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.clientslist',

    store: 'Clients',
    title: 'Clients',
    hideHeaders: true,

    initComponent: function() {
        this.columns = [
            {
                dataIndex: 'ip',
            },
            {
                dataIndex: 'packetsCount',          
            }

        ];

        this.callParent();
    }
});

LocationsList.js：

Ext.define('GeoSbiffer.view.LocationsList', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.locationslist',

    store: 'Locations',
    title: 'Locations',
    hideHeaders: true,

    initComponent: function() {
        this.columns = [{
            dataIndex: 'countryName',
            flex: 1
            },{
            dataIndex: 'city',
            flex: 1             
            }

        ];

        this.callParent();
    }
});

clients.json

{
    "sessions_arr": [ 7, 0, 6, 1, 6, 8, 2, 39, 0, 5, 12, 8],
    "clients_list": [
      {
        "ip": "82.166.201.153",
        "packetsCount": 1,
        "firstPacketUsec": 211474,
        "latestPacketUsec": 211474,
        "location": {
          "countryCode": "IL",
          "countryName": "Israel",
          "region": "unknown",
          "city": "unknown",
          "latitude": 31.5,
          "longitude": 34.75,
          "dma_code": 0,
          "area_code": 0,
          "metro_code": 0,
          "packetsCount": 0,
          "currentSession": 0,
          "clients": []
        },
        "sessionsArr": [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
        "currentSession": 1
      }
    ],
    "status": {
      "executionResult": "OK",
      "isSnifferActive": false,
      "servletInfo": ""
    }
}

locations.json

{
    "sessions_arr": [ 7, 0, 6, 1, 6, 8, 2, 39, 0, 5, 12, 8],
    "locations_list": [
      {
        "countryCode": "US",
        "countryName": "United States",
        "region": "CA",
        "city": "Palo Alto",
        "postalCode": "94304",
        "latitude": 37.376205,
        "longitude": -122.1826,
        "dma_code": 807,
        "area_code": 650,
        "metro_code": 807,
        "packetsCount": 2,
        "sessionsArr": [ 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
        "currentSession": 0,
        "clients": [
          {
            "ip": "69.171.242.14",
            "packetsCount": 2,
            "firstPacketUsec": 368942,
            "latestPacketUsec": 369060,
            "sessionsArr": [ 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            "currentSession": 0
          }
        ]
      }
    ],
    "status": {
      "executionResult": "OK",
      "isSnifferActive": false,
      "servletInfo": ""
    }
}

尝试通过堆栈跟踪使用Firebug进行调试没有提供任何有用的信息。

我错过了什么？

代码失败的地方：

Call stack and breakpoint place

Answer 1

使用加载程序时，请确保您使用ext-all-dev.js（或ext-dev.js）而不是 -debug。 -dev会报告加载程序错误，但-debug不会。随着应用程序的增长，这类问题很难跟踪，但开发人员会立即报告（在您的控制台中）。

我只看过一次这样的花絮，但它节省了我几天的调试时间。

Answer 2

我重新发布了这个错误，我发现GeoSniffer.store.Clients，因为你的client.js文件中有拼写错误。 GeoSniffer.model.client代替GeoSniffer.model.Client。 * List文件中也使用GeoSbiffer命名空间。

无法解决“c不是构造函数”错误

2 个答案: