如何获得参考并采取行动？ Sencha Touch 2.0

Question

代码如下所示。我正在尝试实现一个简单的聊天应用程序，这里的List是msgs的内存存储。我发现在this.getMsgList().add([myPanel]);之后，列表仍然没有新项目。

我正在寻找获取msgList引用并添加新引用的正确方法（希望是imm）

Ext.define('Chat.controller.Main', {
extend: 'Ext.app.Controller',

views: ['MainView'],

config: {
    refs: {
        msgBox: '#msgBox',
        msgList: '#msgList'
    }
},

    init: function () {
    console.log('controller inited.')
    this.control({
        'button[action=submitMsg]':{
            tap: 'submitMsgToServer'
        }
    });
},

submitMsgToServer: function() {
    console.log('submitMsgToServer')
    var msg = this.getMsgBox()
    //Ext.Msg.alert(msg)
    //console.log(this.getMsgBox())
    var myPanel = Ext.create('Ext.Panel', {
        data: [ {string: msg} ]
    });

    this.getMsgList().add([myPanel]);
    console.log(this.getMsgList())
}

}）;

msgList在这里定义：

Ext.define('Chat.view.MainView', {
extend: 'Ext.Panel',

config: {

    layout: {
        type: 'fit'
    },

    items: [
        {
            docked: 'top',
            xtype: 'titlebar',
            title: 'Chat'
        },
        {
            docked: 'bottom',
            xtype: 'toolbar',
            items: [
                { 
                    xtype: 'textfield', 
                    id: 'msgBox'
                },
                { 
                    xtype: 'button',
                    ui: 'confirm',
                    text: 'send',
                    action: 'submitMsg'
                }
            ]
        },
        {
            xtype: 'list',
            id: 'msgList',
            itemTpl: [
                '<div>List Item {string}</div>'
            ],
            data: [
                        { string: 'Item 1' },
                        { string: 'Item 2' }
            ]
        }
    ]


}

}）;