如何在Sencha Architect中将控制器引用到视图

我创建了一个带有一个面板的视图，它内部包含 2 个表单面板，即"欢迎"和"联系我们"。欢迎"包含一个按钮，并包含一个"点击"事件。按下该按钮应该隐藏"欢迎"表单，并应显示"联系我们"表单。我添加了一个控制器并在按钮上添加了事件。现在我的问题是如何从面板中选择单个窗体以及如何在控制器中引用这些单独的窗体。控制器引用具有"选择器"、"xtype"和"ref"等字段。我需要帮助来填写这些字段。我会感谢帮助我的人:)

'/*

*文件：应用程序/视图/联系我们.js * * 此文件由 Sencha Architect 版本 2.2.2 生成。 * http://www.sencha.com/products/architect/* * 此文件需要在独立许可下使用 Ext JS 4.2.x 库。 * Sencha Architect 的许可证不包括 Ext JS 4.2.x 的许可证。欲了解更多信息 * 详情请参阅 http://www.sencha.com/license 或联系 license@sencha.com。 * * 每次保存项目时，此文件都会自动生成。 * * 请勿手动编辑此文件。 */

Ext.define('MyApp.view.contactus', {
extend: 'Ext.panel.Panel',
alias: 'widget.contactus',
height: 724,
width: 479,
initComponent: function() {
    var me = this;
    Ext.applyIf(me, {
        items: [
            {
                xtype: 'welcome',
                frame: true,
                height: 250,
                html: 'Thank you for visiting our site! We welcome your feedback;       itemId: 'welcomeid',
                width: 400,
                layout: {
                    align: 'middle',
                    type: 'hbox'
                },
                bodyPadding: 10,
                title: 'Welcome',
                dockedItems: [
                    {
                        xtype: 'toolbar',
                        flex: 1,
                        dock: 'top',
                        items: [
                            {
                                xtype: 'button',
                                itemId: 'contactusId',
                                margin: '0 0 50 50',
                                maxWidth: 70,
                                width: 70,
                                allowDepress: false,
                                preventDefault: false,
                                text: 'MyButton'
                            }
                        ]
                    }
                ]
            },
            {
                xtype: 'contactus',
                frame: true,
                height: 250,
                hidden: true,
                itemId: 'contactid',
                margin: '10 0 0 0',
                width: 400,
                bodyPadding: 10,
                title: 'Contact Us ',
                tools: [
                    {
                        xtype: 'tool'
                    }
                ],
                items: [
                    {
                        xtype: 'container',
                        layout: {
                            align: 'stretch',
                            type: 'hbox'
                        },
                        items: [
                            {
                                xtype: 'textfield',
                                flex: 1,
                                fieldLabel: 'Name',
                                labelWidth: 35,
                                allowBlank: false,
                                emptyText: 'FirstName'
                            },
                            {
                                xtype: 'textfield',
                                margin: '0 0 0 5',
                                width: 45,
                                fieldLabel: ''
                            },
                            {
                                xtype: 'textfield',
                                margin: '0 0 0 10',
                                width: 145,
                                allowBlank: false,
                                emptyText: 'LastName'
                            }
                        ]
                    },
                    {
                        xtype: 'textfield',
                        anchor: '100%',
                        padding: '10 0 0 0',
                        fieldLabel: 'Email',
                        labelWidth: 50,
                        allowBlank: false,
                        vtype: 'email',
                        vtypeText: 'Enter a valid email Id!!'
                    },
                    {
                        xtype: 'container',
                        items: [
                            {
                                xtype: 'toolbar',
                                id: '',
                                margin: '0 0 0 280',
                                items: [
                                    {
                                        xtype: 'button',
                                        itemId: 'saveId',
                                        text: 'Save'
                                    },
                                    {
                                        xtype: 'button',
                                        itemId: 'cancelId',
                                        text: 'Cancel'
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ]
    });
    me.callParent(arguments);
}

}）;

Ext.define（'MyApp.controller.MyController'， { extend： 'Ext.app.Controller'，

refs: [
    {
        autoCreate: true,
        ref: 'welcome',
        selector: 'welcome',
        xtype: ''
    },
    {
        ref: 'contactus',
        selector: 'contactus'
    }
],
onButtonClick: function(button, e, eOpts) {
    debugger;
    var form=this.getContactus();
    var form1=this.getWelcome();
    form.show();
    //debugger;
    //form1.setDisabled(true);
    //form1.disable(true);
    form1.hide();
},
onSaveButtonClick1: function(button, e, eOpts) {
    var form=this.getContactus();
    var form1=this.getWelcome();
    form.hide();
    form1.show();
},
init: function(application) {
    this.control({
        "button#contactusId": {
            click: this.onButtonClick
        },
        "button#saveId": {
            click: this.onSaveButtonClick1
        }
    });
}

}）;'