Question

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

我稍微google了一下，发现了这个..

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

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

有没有办法听这些事件？我不想让jQuery混入这里，因为它会有点过分。

Answer 1

许多组件从中继承方法的container xtype具有一个事件，该事件在更改它的disabled状态时触发。此事件称为disabledchange，每次启用/禁用容器时都会触发。

在下面的代码中，我们可以看到这个在button上工作，纯粹因为它提供了一个视觉上更好的演示（因为你可以立即看到状态），但它从Container继承了完全相同的方法和事件。

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

Answer 2

好的，我刚刚找到了问题的答案。

Ext.define('My.custom.Container',{
   extend:'Ext.Container',
   config:{
      ....config....
   },
   enable: function(){
       this.callParent(arguments);
       // do something else;
   },
   disable: function(){
      this.callParent(arguments);
      // do something else;
   }
});

我仍然很好奇是否有另一种解决方法。所以答案仍然是受欢迎的。

收听Sencha Touch上的启用/禁用事件

2 个答案: