如何在Sencha Touch中的按钮处理程序中使用this.up()函数

时间:2014-06-02 00:35:39

标签: javascript extjs sencha-touch

我已经研究过这个问题,但这并没有解决我的问题 How to use up() in Ext.Button handler

我正在尝试实现一个简单的按钮处理程序,并希望处理Panel工具栏的按钮。我在面板中定义了一个onNewFeed3函数,不确定在点击按钮的点击事件时如何调用它。我不想使用单独的控制器类,但希望在View类中使用它。上面的链接似乎回答了这个问题,我仍然在下面的代码中提到了两个错误。

第一个评论之后第一个代码的原因是为了确定"这个"的XType,我不知道最好的方法是什么,因为我得到了一个类型错误

由于

Ext.define('Volt.view.FeedView', {
    extend: 'Ext.Panel',

    requires: [
        'Ext.TitleBar',
        'Ext.Button',
        'Ext.Toolbar'
        //'Ext.Panel'
    ],

    xtype: 'feedViewCard',



    config: {
        iconCls: 'action',
        title: 'FeedView',

        layout: {
            type: 'vbox'
        },

        items: [
            {
                xtype: 'toolbar',
                title: 'Home',
                docked: 'top',
                items: [
                    {
                        xtype: 'spacer'

                    },
                    {
                        xtype: 'button',
                        text: 'New2 Feed',
                        ui: 'action',
                        id: 'new_note_button',

/*  I HAVE TRIED THIS AND DOES NOT WORK - GIVES TypeError : undefined is not a function */
                        handler: function(){
                            console.log('button tapped inline handler, xtype =');
                            console.log(this.getXTypes());

                        },

/*  and this gives the same error as well : TypeError : undefined is not a function*/
                        handler: this.up('feedViewCard').onNewFeed3,

                        scope: this
                    }

                ]

            }
        ]
    },

    onNewFeed3: function(){
        console.log('New Feed 3 button clicked');
    }

});

2 个答案:

答案 0 :(得分:2)

您的处理程序不在按钮范围内运行,因此this的错误指向全局范围(窗口)。按钮处理程序接收单击的按钮作为第一个参数,因此处理程序应显示为:

handler:function(btn) {
    btn.up('feedViewCard').onNewFeed3();
}

答案 1 :(得分:0)

将其更改为类似的东西(因为处理程序已在视图范围内执行而且未指向按钮,因此无效):

handler: function() {
    this.up('feedViewCard').onNewFeed3();
}

您始终可以使用

调试功能范围
console.log(this)

如果默认情况下处理程序正在视图本身的范围内执行,则根本不需要任何查找功能。将处理程序更改为:

handler: function() {
    this.onNewFeed3();
}