设置extjs 6组合框's在运行时存储数据会导致显示错误

我有一个组合框的原型，我试图在运行时设置存储数据。

当我尝试这样做时，组合框下的菜单不会渲染（或者它渲染得太小以至于你实际上看不到它）。它在这里的sencha小提琴：

Ext.define('ComboBoxRates',{
    extend: 'Ext.data.Store',
    alias: 'store.rates',
    storeId: 'ratescombo',
    fields: ['rate', 'description', 'price' ]
});
Ext.define('ComboPanel',{
    extend: 'Ext.panel.Panel',
    title: 'Test',
    renderTo: Ext.getBody(),
    items:[
        {
            xtype: 'combobox',
            editable: false,
            displayField: 'description',
            valueField: 'price',
        }
    ]    
});

Ext.application({
    name : 'Fiddle',
    launch : function() {
        var data = [
            {
                description: "$105: Standard Registration",
                price: "105",
                rate: "rate1"
            },
            {
                description: "$125: Non-Member Rate",
                price: "125",
                rate: "rate2"
            },
            {
                description: "$44: Price for SK tester",
                price: "44",
                rate: "rate3"
            },
            {
                description: "$11: Another price :O",
                price: "11",
                rate: "rate5"
            }
        ];
        var rates = Ext.create('ComboBoxRates');
        rates.setData(data);
        // Showing data is loaded into the store
        console.group('directly from store instance');
        rates.each(function (rate){
           console.log(rate.getData());
        });
        console.groupEnd();
        var panel = Ext.create('ComboPanel');

        panel.down('combobox').setStore(rates);
        // Showing that the data is definitely in the widget's store        
        console.group('from widget store');
        panel.down('combobox').getStore().each(function (rate){
           console.log(rate.getData());
        });
        console.groupEnd();

    }
});

我知道数据被加载到combobox的存储中（在fiddle中打开控制台日志），所以我不确定为什么它没有正确渲染。

我知道在这种情况下这看起来很傻，但原型是从网格的小部件列中提取的逻辑，其中每行都有不同的存储数据。

我还构建了一个后退一步的原型，该原型具有相同的结构，但相同的数据被内联在商店的定义中，这很有效：

Ext.define('ComboBoxRates',{
    extend: 'Ext.data.Store',
    alias: 'store.rates',
    storeId: 'ratescombo',
    fields: ['rate', 'description', 'price' ],
    data: [
        {
            description: "$105: Standard Registration",
            price: "105",
            rate: "rate1"
        },
        {
            description: "$125: Non-Member Rate",
            price: "125",
            rate: "rate2"
        },
        {
            description: "$44: Price for SK tester",
            price: "44",
            rate: "rate3"
        },
        {
            description: "$11: Another price :O",
            price: "11",
            rate: "rate5"
        }
    ]
});
Ext.define('ComboPanel',{
    extend: 'Ext.panel.Panel',
    title: 'Test',
    renderTo: Ext.getBody(),
    items:[
        {
            xtype: 'combobox',
            editable: false,
            displayField: 'description',
            valueField: 'price',
        }
    ]    
});

Ext.application({
    name : 'Fiddle',
    launch : function() {

        var rates = Ext.create('ComboBoxRates');
        var panel = Ext.create('ComboPanel');
        panel.down('combobox').setStore(rates);
    }
});

我以为updateLayout可以解决这个问题，但事实并非如此。

我的代码有问题吗？有没有办法在运行时设置组合框的值？