如何在商店更新後調整Sencha Touch selectfield的選擇器？

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) { 
      ... 
     } 
    } 
} 

該選擇欄是一個浮動的面板內。每次我展示（）浮動面板時，我的商店都會自行更新。這樣，選擇字段也會被更新。但是，這隻在我顯示（）面板的時候纔有效。隨後我顯示（）浮動面板時，選擇字段正確顯示更新的數據，但當單擊選擇字段時顯示的選取器未正確調整大小。它的大小根據浮動面板首次顯示時的數據行數而定。

TLDR：如何在商店更新後調整Sencha Touch selectfield的選擇器？

下面是截圖。第二次單擊選擇字段時，選取器面板不會調整大小以適合整個商店的內容。

Answer 1

好像設定的寬度和高度部分地解決了這一問題。

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

我還有一些其他問題，我無法有時從selectfield中選擇一個項目。很奇怪。

Answer 2

感謝您的解決方法我做的東西有點不同

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

這可能是有點低效率的，但它本身在每次數據改變時計算的寬度和高度。