Sencha touch 2 如何通过单击Sencha Touch中的列表项来更改视图？

下面是我的Sencha Touch应用程序的结构。我有一个视图，我给了它xtype主页。在主页视图中，我有以下项目

停靠在顶部的工具栏。 应用程序左侧的列表 在右侧，我有一个视图，其中有一个id为display的显示器

问题：现在我想当我点击列表中的不同选项时，不同的视图应该显示在主页的右侧

---

我能够在控制器中调用列表项点击功能，并且我能够识别列表中的不同项。唯一的问题是，我无法用另一个视图替换给定的显示

好的，在网上搜索了一下后，我找到了以下解决方案。我应该使用布局：'card'到我需要在其中更改视图的容器。在我的例子中，它是一个带有id显示的容器

然后在Controller.js中，我应该编写以下代码：

        var item = Ext.ComponentQuery.query("#display")[0];
        item.setActiveItem({xtype:'xtype_of_your_view'});