0

我创建了一个导航,其中一个容器有两个面板;一个用于一个接一个地添加面板,另一个作为包含 NEXT 和 BACK 按钮的页脚。面板是单独创建的。

当使用其中的 xtype 动态添加面板时,事件处理程序一次运行良好,但导航回事件处理程序没有响应(viewSettingSelectionPanel 函数)。事件处理程序位于主控制器中。

我发现这将有助于在面板中使用 itemId 而不是 Id。(因为它注册了两个具有相同 id 并且冲突的组件)但是在这种情况下我如何在控制器中引用它们..

请帮助我理解这个问题和解决方案。

提前致谢。

--- 我的应用程序 ---

var current = 0;
var myPanel = new Array("panelOne", "panelTwo", "panelThree", "panelFour", "panelFive");

Ext.define("myApp.controller.MainController", {
    extend: "Ext.app.Controller",

    config: {
        refs: {
            backButton: '#backButton',
            nextButton: '#nextButton',
            panelArea: '#panelArea',
            main: '#main',
            panelOne: '#panelOne',
            panelTwo: '#panelTwo',
            panelThree: '#panelThree',
            panelFourP: '#panelFour',
            panelFiveP: '#panelFiveP',
            footer: '#footer',
            settingSelectionPanel: '#settingSelectionPanel',
            selectSettingTextField: '#selectSettingTextField',
        },

        control: {
            backButton: {
                tap: 'navigateBack'
            },
            nextButton: {
                tap: 'navigateNext'
            },
            selectSettingTextField: {
                focus: 'viewSettingSelectionPanel'
            },
        },
    },

    navigateBack: function() {
        current = current - 1;
        this.addPanel(myPanel[current]);
    },

    navigateNext: function() {
        current = current + 1;
        this.addPanel(myPanel[current]);
    },

    addPanel: function(newPanel) {
        this.getPanelArea().removeAt(0);
        this.getPanelArea().add({
            xtype: "" + newPanel + ""
        });
    },

    viewSettingSelectionPanel: function(input) {
        this.getSelectSettingTextField().disable();
        this.getSettingSelectionPanel().showBy(input);
        this.getSelectSettingTextField().enable();
    }
});
4

0 回答 0