javascript - 监听 Sencha Touch 上的启用/禁用事件

Question

我需要监听容器上的启用/禁用事件，但我注意到没有这样的事件。我试着听听它，以防文档中没有提到它，但它肯定不存在。

我用谷歌搜索了一下，发现了这个..

Ext.define('My.Custom.Container',{
    extend:'Ext.Container',
    onEnable:function(){
        console.log("it's listening");
    }
});

看起来很有希望，但根本不起作用。

有什么办法可以监听这些事件吗？我不想在这里混合 jQuery，因为这有点过分了。

Answer 1

许多组件从中继承方法的容器 xtype确实有一个在其禁用状态发生变化时触发的事件。此事件称为 disabledchange，每次启用/禁用容器时都会触发。

在下面的代码中，我们可以看到它在按钮上运行，纯粹是因为它提供了视觉上更好的演示(因为您可以立即看到状态)，但它继承了完全相同的方法和事件来自容器。

Ext.application({
    name: 'Fiddle',

    launch: function() {
        Ext.Viewport.add({
            xtype: 'container',
            padding: 10,
            items: [{
                xtype: 'button',
                text: 'Button To be disabled/enabled',
                listeners: {
                    disabledchange: function(button, value, oldValue, eOpts) {
                        console.log('changing my disabled state to ' + value);
                    }
                }
            }, {
                xtype: 'button',
                text: 'click to disable/enable above button',
                listeners: {
                    tap: function() {
                        var isButtonDisabled = Ext.Viewport.query('button')[0].getDisabled();
                        Ext.Viewport.query('button')[0].setDisabled(!isButtonDisabled);
                    }
                }
            }]
        });
    }
});

演示:https://fiddle.sencha.com/#fiddle/g46