在 Sencha Architect 中更改视图答案

【问题标题】：Change View in Sencha Architect在 Sencha Architect 中更改视图
【发布时间】：2012-07-09 20:10:05
【问题描述】：

我对 Sencha Architect 和 EXTJ 还很陌生。我创建了一个具有多个视图（2 个容器）的应用程序。单击container1中的按钮时，我试图切换视图。我创建了一个触发良好的事件，我不知道如何切换到下一个视图？我试过了：

if(Ext.getCmp('mainView'))
{
    Ext.Viewport.setActiveItem(Ext.getCmp('mainView'));
}
else 
{
    var view = Ext.create('Snapwire.view.mainView');
    Ext.Viewport.setActiveItem(view);
}

但这只会引发控制台错误：

Uncaught TypeError: Object function () {
            return this.constructor.apply(this, arguments);
        } has no method 'setActiveItem'

谢谢！

【问题讨论】：

你用的是什么容器？还有哪个版本的煎茶？ 1 还是 2？
我正在使用 Ext.container.Container，Sencha 2，Architect 2
您在使用卡片布局吗？这就是你应该使用的

标签： extjs sencha-touch-2 sencha-architect

【解决方案1】：

您可以使用导航视图实现您想要的请检查此链接

http://docs.sencha.com/architect/2/#!/guide/navigationview

希望对你有帮助^^

【讨论】：

【解决方案2】：

Ext.getCmp('mainView') 仅在您为其设置 id 时才返回您的主视图。在你的类定义中，添加这个配置：

id: 'mainView'

【讨论】：

【解决方案3】：

我是这样做的：

Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);  
Ext.Viewport.add([
 { xtype: 'searchwords' }
 ]);

这里，

xtype:searchwords

是一个叫做 SearchWords 的视图，它被定义为

alias: 'widget.searchwords'

希望对你有所帮助。

【讨论】：

【解决方案4】：

您可以尝试使用卡片布局并通过以下方式更改视图：

container.setActiveItem(1);

或

container.setActiveItem(0);

（在使用 setActiveItem 之前必须添加所有容器，但它只会显示活动项）

【讨论】：