Question

我正在尝试让MVC在我的第一个应用程序中工作，并且我正在尝试更改基于工具栏中单击的卡片按钮。

当我单击工具栏中的hello或world按钮时，我收到运行时错误： TypeError：无法读取行中未定义的属性'items'： var exerciseListPanel = this.items.items[0], // CODE ERRORS HERE!

我在获取对面板中项目的引用时遇到问题，为什么？

以下是该小组的完整代码：

        MyApp.views.HomeScreenPanel = Ext.extend(Ext.Panel, {
        layout : 'card',
        cardSwitchAnimation: 'slide',
        initComponent : function() {
            this.dockedItems = this.buildDockedItems();
            this.items = this.buildItemList();
            MyApp.views.HomeScreenPanel.superclass.initComponent.call(this);
        },
        buildItemList : function(){
            return [
                new Ext.Panel({html:"hello"}),
                new Ext.Panel({html:"world"}),
            ];
        },
        buildDockedItems : function(){
            return [
                this.buildTopDockToolbar(),
                this.buildBottomDockToolbar(),
            ];
        },
        buildTopDockToolbar : function(){
            return {
                xtype : 'toolbar',
                dock  : 'top',
                title : 'My first MVC app',
            };
        },
        buildBottomDockToolbar : function(){
            return this.NavigationToolbar();
        },
        NavigationToolbar : function(){
            return{
                xtype : 'toolbar',
                dock : 'bottom',
                defaults : {
                    handler : this.NavigationToolbarHandler,
                    controller: 'NavigationBarController'
                },
                items : [
                {
                    text : 'hello',
                    action: 'hello'
                },
                {
                    text : 'world',
                    action : 'world'
                }]
            };
        },    
        NavigationToolbarHandler : function(btn) {

            var exerciseListPanel = this.items.items[0], // CODE ERRORS HERE!
                workoutListPanel  = this.items.items[1];

            Ext.dispatch({
                controller :     btn.controller,
                action :         btn.action,
               views : {
                    exerciseListPanel: exerciseListPanel,
                    workoutListPanel: workoutListPanel,
               }
            })
        },
    });

    Ext.reg('HomeScreenPanel',MyApp.views.HomeScreenPanel);

Here is the code for the controller but I don't there is a problem here:

Ext.regController('NavigationBarController', {
    world : function(dataObj) {
        Ext.Msg.alert(
            'world!',
            'world button pressed from toolbar',
            Ext.emptyFn
        );
        MyApp.views.HomeScreenPanel.setActiveItem(dataObj.views.worldPanel); // CORRECT SYNTAX????


    },
    hello : function(dataObj) {
        Ext.Msg.alert(
            'hello',
            'hello button pressed',
            Ext.emptyFn
        );
        MyApp.views.HomeScreenPanel.setActiveItem(dataObj.views.helloPanel); // CORRECT SYNTAX?????

    }
});

Answer 1

这可能只是一个范围问题。试试：

exerciseListPanel = MyApp.views.HomeScreenPanel.items.items[0];

在这种情况下，this可能是按钮。

Answer 2

Items是一个MixedCollection，所以使用get函数。 http://docs.sencha.com/touch/1-1/#!/api/Ext.util.MixedCollection

MyApp.views.HomeScreenPanel.items.get(0);

有点迟到但是对于其他任何人在谷歌上搜索;）

Sencha touch：无法获取面板中的项目参考

2 个答案: