javascript - 将函数添加到单个 ExtJS 监听器

Question

我试图在同一个监听器中添加两个函数，以便能够将组合的两个值与禁用的两个字段组合起来，并根据它选择的值启用。这是我创建的监听器:

listeners: {
            render: function() {
                var pago = this;
                    pago.onChangeCuentasFn();
                    pago.onChangeFormaPagoFn();
            }
}

这些是监听器调用的函数:

onChangeFormaPagoFn: function(combo, record, index) {
    var iban = Ext.getCmp('clieIban');
    iban.clearInvalid();
    if (record.data.codigo == 4) {
        iban.setDisabled(false);
    } else {
        iban.setDisabled(true);
    }
},

onChangeCuentasFn: function(combo, record, index) {
    var cuenta = Ext.getCmp('clieCuentas');
    cuenta.clearInvalid();
    if (record.data.codigo == 3) {
        cuenta.setDisabled(false);
    } else {
        cuenta.setDisabled(true);
    }
},

我是否必须添加 addListener 或使用监听器内的函数？

谢谢!

Answer 1

Observable 方法 addListener 它的行为是累积的。这意味着如果调用它两次，则处理程序将按时间顺序执行。如果instance.addListener(eventName, handler1,scope1) 和instance.addListener(eventName, handler2,scope2)当 eventName 被触发时handler1 被执行，然后 handler2 被执行(如果 handler1 没有故意停止事件传播或返回 false)。

但是在配置区域中声明监听器不会让您调用 addListener 两次。在那里，您可以像以前一样使用隐式调用，但保留范围和参数(您不需要)，或者将处理程序与 Ext.Function 实用程序结合起来 Ext.Function.createSequence。

var sayHi = function(name){
 alert('Hi, ' + name);
};

sayHi('Fred'); // alerts "Hi, Fred"

var sayGoodbye = Ext.Function.createSequence(sayHi, function(name){
                                                       alert('Bye, ' + name);
                });

sayGoodbye('Fred'); // both alerts show

带有作用域和参数的隐式调用:

listeners: {
        render: function() {
            var me = this;

            if( me.onChangeCuentasFn.apply(me, arguments)!== false ) { // give first hanlder a chance to stop execution if false is returned
              me.onChangeFormaPagoFn.apply(me, arguments);
           }
        }
}

优雅的方式:

initComponent: function () {
  var me = this,
      combindHanlerFn = Ext.Function.createSequence(me.onChangeCuentasFn,me.onChangeFormaPagoFn, me);



  Ext.apply(me, {
    listeners: {
        render:combindHanlerFn 
     }
  });

  return me.callParent(arguments);
);