Question

我对这个示例中更改卡片的语法有点不清楚。我试过在面板上做一个参考，但那不起作用。我想使用底部的onButton函数切换卡片，该函数由提交按钮触发（只是一个按钮 - 在这个例子中并没有真正用作表格）

Ext.application({
    name: 'Sencha',
    main: null,
    refs: [
    {
        ref: "main",
        selector: "mypanel"
    }
    ],
    init: function() {
        this.control({
            '#switch': {
                tap: this.onButton
            },
        })
    },
    launch: function() {
        this.main = Ext.create("Ext.Panel", {
            fullscreen: true,
            layout: 'card',
            xtype: 'mypanel',
            items: [
                {
                title: 'Home',
                iconCls: 'home',
                cls: 'home',
                html: 'home page',
            },
            {
                title: 'Contact',
                iconCls: 'user',
                xtype: 'formpanel',
                url: 'contact.php',
                layout: 'vbox',
                items: [
                   {
                    xtype: 'fieldset',
                    title: 'Contact Us',
                    instructions: '(email address is optional)',
                    items: [
                        {
                            xtype: 'textfield',
                            label: 'Name'
                        },
                        {
                            xtype: 'emailfield',
                            label: 'Email'
                        },
                        {
                            xtype: 'textareafield',
                            label: 'Message'
                        }
                    ]
                },
                {
                    xtype: 'button',
                    itemId: 'switch',
                    id: 'switch',
                    text: 'Send',
                    ui: 'confirm',
                }
                ]
            }
            ]
        });

        this.main.setActiveItem(1);
    },
    onButton: function() {
            //? how do I switch from here
    }
});

提前致谢

Answer 1

您是否在onButton（）方法中尝试了this.main.setActiveItem(1);？

如果您想通过此“切换”按钮切换卡片，您只需在“启动”方法中设置变量说this.activeItemNo = 0;，并在onButton方法中使用if-else条件。希望有所帮助。

Answer 2

原来在ST开发预览2中有一个错误。范围未正确传递给onButton函数。切换的预期方法是this.main.setActiveItem（）因为这个问题而对我不起作用。现在的范围可以在控制方法中传递：

Ext.application({
    name: 'Sencha',
    main: null,
    refs: [
    {
        ref: "main",
        selector: "mypanel"
    }
    ],
    init: function() {
        this.control({
            '#switch': {
                tap: this.onButton
            },
        }, null, this)  //this is what is needed
    },
    launch: function() {
        this.main = Ext.create("Ext.Panel", {
            fullscreen: true,
            layout: 'card',
            xtype: 'mypanel',
            items: [
                {
                title: 'Home',
                iconCls: 'home',
                cls: 'home',
                html: 'home page',
            },
            {
                title: 'Contact',
                iconCls: 'user',
                xtype: 'formpanel',
                url: 'contact.php',
                layout: 'vbox',
                items: [
                   {
                    xtype: 'fieldset',
                    title: 'Contact Us',
                    instructions: '(email address is optional)',
                    items: [
                        {
                            xtype: 'textfield',
                            label: 'Name'
                        },
                        {
                            xtype: 'emailfield',
                            label: 'Email'
                        },
                        {
                            xtype: 'textareafield',
                            label: 'Message'
                        }
                    ]
                },
                {
                    xtype: 'button',
                    itemId: 'switch',
                    id: 'switch',
                    text: 'Send',
                    ui: 'confirm',
                }
                ]
            }
            ]
        });

        this.main.setActiveItem(1);
    },
    onButton: function() {
        this.main.setActiveItem(0);
    }
});

Answer 3

您是否尝试过Ext.getCmp('componentId').setActiveItem(1);

您当然需要为主面板指定id。

在sencha触摸切换卡

3 个答案: