Sencha touch setActiveItem 逻辑解释

Question

（完全重新编辑我之前的帖子）

我正在尝试构建我的第一个 Sencha 触控应用，但遇到了问题。

在我的视口中，我有 2 个 xtype：Home 和 ContainerListAdress。

当我点击ContainerListAdress 图标时，卡片会滑到列表中。

这是我的代码（在 listcard.js 中）：

    // My List view card

myAPP.views.ListAdressCard = Ext.extend(Ext.List, {
id:'listadresscard',
    styleHtmlContent: true,
    // cardSwitchAnimation: 'slide',
    // items: [{ xtype: 'detailcard' } ],
    store: myAPP.ListStore,
    itemTpl: '<div>{name}</div>',
    grouped: true,
    onItemDisclosure: function(){
            myAPP.views.containerlistadresscard.setActiveItem('detailcard');
            }
});


// My container for both the list and the detail view

myAPP.views.ContainerListAdressCard = Ext.extend(Ext.Panel, {
    id: "containerlistadresscard",
    iconCls: "search",
    styleHtmlContent: true,
    cardSwitchAnimation: 'slide',
    layout:'card',
    items: [{xtype:'listadresscard'}, {xtype:'detailcard'}]
});

Ext.reg('listadresscard', myAPP.views.ListAdressCard);
Ext.reg('containerlistadresscard', myAPP.views.ContainerListAdressCard);

然后在 detailcard.js 我有

DetailcardToolbar = new Ext.Toolbar ({
    id:'detailbar',
    title: 'station',
    dock:'top'


});


myAPP.views.Detailcard = Ext.extend(Ext.Panel, {
    id: 'detailcard',
    styleHtmlContent: true,
    html: 'Made from coffee',
dockedItem:[DetailcardToolbar]

});

Ext.reg('detailcard', myAPP.views.Detailcard);

我的错误是

Uncaught TypeError: Cannot call method 'setActiveItem' of undefined

如果我用骆驼包装的 containerlistadresscard 我得到了

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

但是容器中引用了我要设置为活动的详细信息卡？

感谢您的帮助。

---------------编辑------- ---------

为了清楚起见，我决定将所有内容放在一页中，但面临同样的问题

var myAPPDetailcard = new Ext.Panel ({
    id: 'detailcard',
    styleHtmlContent: true,
    html: 'Made from coffee',
layout: 'fit'
});



var myAPPListAdressCard = new Ext.List ({
    id:'listadresscard',
    styleHtmlContent: true,
    store: myAPP.ListStore,
    itemTpl: '<div>{name}</div>',
    grouped: true,
    onItemDisclosure: function(){
            myAPP.views.ContainerListAdressCard.setActiveItem(myAPPDetailcard);
            }
});


// My container for both the list and the detail view

myAPP.views.ContainerListAdressCard = Ext.extend(Ext.Panel, {
    id: "containerlistadresscard",
    iconCls: "search",
    styleHtmlContent: true,
    cardSwitchAnimation: 'slide',
    layout:'card',
    items: [myAPPListAdressCard, myAPPDetailcard]
});

Ext.reg('containerlistadresscard', myAPP.views.ContainerListAdressCard);

Answer 1

不，Ext.extend() 定义了一个类。在这里，您以这种方式创建了一个类：

myAPP.views.ContainerListAdressCard = Ext.extend(Ext.Panel, {
    id: "containerlistadresscard",
    iconCls: "search",
    styleHtmlContent: true,
    cardSwitchAnimation: 'slide',
    layout:'card',
    items: [myAPPListAdressCard, myAPPDetailcard]
});

然后你像这样创建它的一个实例：

var mainContainer = new myAPP.views.ContainerListAdressCard({
                         fullscreen : true
                    });

您可以在此mainContainer 变量上调用setActiveItem()，而不是在类定义上。

.....
onItemDisclosure: function(){
    mainContainer.setActiveItem(myAPPDetailcard);
}

希望对您有所帮助。