尝试滚动Ext.List时出现未捕获的类型错误

Question

目前，我正在尝试使用Sencha Touch 2。 我制作了一个简单的json存储，其中包含比屏幕显示更多的项目来测试滚动，但是每次尝试滚动时，都会出现以下错误：

Uncaught TypeError: Cannot call method 'getCount' of null

我试图找出问题所在，但仍未找到解决方案。 也许有人可以帮忙吗？ 这是我的示例文件：

host.json：

{
"hosts": [
    {
        "host_name": "host 1",
        "status": "pending"
    },
    {
        "host_name": "host 2",
        "status": "normal"
    },
    {
        "host_name": "host 3",
        "status": "critical"
    }

            ...

]
}

我的商店：

Ext.define('myapp.store.MyStore', {
extend: 'Ext.data.Store',

config: {
    storeId: 'mystore',
    model: 'myapp.model.MyModel',

    proxy: {
        type: 'ajax',
        url: 'host.json',
        reader: {
            type: 'json',
            rootProperty: 'hosts'
        }
    },
    autoLoad: true
}

});

列表视图：

  Ext.define('myapp.view.MyListView', {
extend: 'Ext.dataview.List',
alias: 'widget.mylistview',



config: {
    items: {
        xtype: 'list',
        store: 'mystore',
        itemTpl: '<div class="service_status_{status}">{host_name}</div>'
    }
}
});

以及List-View所在的视图：

Ext.define('myapp.view.Main', {
extend: 'Ext.Container',

config: {
    layout: {
        type: 'vbox',
        aligh: 'stretch'
    },

    items: [
        {
            xtype: 'mytoolbar',
            docked: 'top',
            height: 50
        },
        {
            xtype: 'mylistview',
            flex: 1
        }
    ]
}
});

Answer 1

使用“适合”布局可能会解决问题。

您肯定也应该更改以下内容：

这已经定义了一个列表

Ext.define('myapp.view.MyListView', {
    extend: 'Ext.dataview.List',
    xtype: 'mylistview',

这是列表的配置：

    config: {

在这里，您可以在列表中添加一个实际使用的列表。 这不会顺利进行。 这将是一个很好的理由，说明某些问题无法按预期进行。

    items: {
        xtype: 'list',
        store: 'mystore',
        itemTpl: '<div class="service_status_{status}">{host_name}</div>'
    }