Up函数在元素的事件处理程序中不起作用

debugcn 发表于 Dev

汤姆·O

我在下面的代码可以正常工作的以下代码：

var container = Ext.create('Ext.Container', {
                    html: 'Click Me!',
                    listeners: {
                        click: {
                            element: 'el',
                            fn: function() {
                                Ext.Msg.alert('Test', 'It was clicked!');
                             }
                         }
                     }
                 });

Ext.create('Ext.panel.Panel', {
    itemId: 'mainContainer',
    renderTo: Ext.getBody(),
    border: false,
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    items: [container]
});

在这个例子中，我只是警告一些废话，但是我实际上想使用'up（）'方法获取父容器的itemId，但是它并没有像我期望的那样工作。例如，如果我将点击处理程序更改为此：

click: {
    element: 'el',
    fn: function() {
        console.log(this.up('panel'));
    }
}

然后记录为“ null”。为什么我不能在这里使用up（）函数，并且有一种方法可以更改此代码，以便我可以使用它？

斯图尔特

为了扩展Surya的答案，this在事件处理程序中是引发事件的Ext.dom.Element实例，而不是Ext.Container实例。

一种替代方法是使用on方法添加侦听器，以便您可以将处理程序的作用域强制为容器实例。

container.on({
        click: {
            element: 'el',
            fn: function() {
                console.log(this.up('panel'));
            },
            scope: container
        }

    });

看一下这个小提琴，它实际上发挥了作用：

https://fiddle.sencha.com/#fiddle/1cka

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。