如何在商店更新后调整Sencha Touch选择器的选择器大小？

Question

我正在开发Sencha Touch应用程序。我目前正在尝试通过商店填充SelectField。

我商店的代码是：

var store_Blocks = new Ext.data.JsonStore({
    model: 'Blocks',
    proxy: {
        type: 'ajax',
        url: '/search-blocks',
    },
    autoLoad: false,
    remoteFilter: true,
    listeners: {
        load: function(store, records, success) {
            Ext.getCmp('selectfield_Blocks').setDisabled(false);
        }
    }
});

我的选择字段的代码是：

{
    id: 'selectfield_Blocks',
    xtype: 'selectfield',
    name: 'block',
    label: 'Block number',
    disabled: true,
    store: store_Blocks,
    listeners: {
        change: function(selectfield, block) {
            ...
        }
    }
}

此选择字段位于浮动面板内。每次我展示（）浮动面板，我的商店都会更新。因此，选择字段也会更新。但是，这只是我第一次显示（）面板时。随后我展示（）浮动面板，selectfield正确显示更新的数据，但单击selectfield时显示的选择器未正确调整大小。它的大小取决于首次显示浮动面板时的数据行数。

TLDR：如何在商店更新后调整Sencha Touch selectfield选择器的大小？

下面是截图。第二次单击选择域时，选取器面板不会调整大小以适合整个商店的内容。

Answer 1

似乎设置宽度和高度部分解决了问题。

Ext.getCmp('selectfield_Blocks').getListPanel().setHeight(300);
Ext.getCmp('selectfield_Blocks').getListPanel().setWidth(100);

我还有一些其他问题，我有时无法从选择字段中选择一个项目。很奇怪。

Answer 2

感谢您的解决方法，我做了一些不同的事情

    selectField.setOptions(options);
    if (Ext.isDefined(selectField.listPanel)) {
        selectField.listPanel.destroy();
        selectField.listPanel = undefined;
    }

效率可能稍低，但每次更改数据时都会自行计算宽度和高度。