重新定义ExtJS事件并委托给以前的实现

Question

我继承了一个大的ExtJS3代码库，并且有Ext.grid的"基本"覆盖。CellSelectionModel beforecellselect。我截断了大量的代码，但这应该提供了大致的思路:

Ext.override(Ext.grid.CellSelectionModel, {
    init:function() {
        Ext.grid.CellSelectionModel.superclass.init.apply(this, arguments);
        if (this.unselectableColumns || this.visuallyMimicRowSelection || this.colSpecificHandlers){
        this.on('beforecellselect', function(selModel, rowIndex, columnIndex){
            //etcetera

然而，随后我们实例化CellSelectionModel，并在其上指定beforecellselect侦听器，如下所示:

var sm = new Ext.grid.CellSelectionModel({
listeners: {
    beforecellselect : {
    fn: function(selModel, rowIndex, colIndex) {
            //etcetera

问题是，从新的CellSelectionModel实例的监听器内部，我还需要调用在覆盖中定义的监听器。因为ExtJS似乎保留了一组同名的事件侦听器，所以我可以委托如下:

selModel.events.beforecellselect.listeners[1].fn.apply(selModel, arguments);

好的，我知道我不应该硬编码索引。但除此之外，有没有更好的、更符合extjs的方法来做到这一点呢?

Answer 1

在你的例子中，如果你知道它将是一个将在构造函数之外使用的函数，我建议将事件处理程序函数添加为CellSelectionModel的方法实例，如下所示:

    Ext.override(Ext.grid.CellSelectionModel, {
        init:function() {
            Ext.grid.CellSelectionModel.superclass.init.apply(this, arguments);
            this.customBeforeCellSelect = function(selModel, rowIndex, colIndex) {
                // etcetera
            };
            if (this.unselectableColumns
                || this.visuallyMimicRowSelection
                || this.colSpecificHandlers) {
                this.on('beforecellselect', this.customBeforeCellSelect, this);
            }
    });
    var sm = new Ext.grid.CellSelectionModel({
        listeners: {
            beforecellselect : {
                fn: function(selModel, rowIndex, colIndex) {
                    selModel.customBeforeCellSelect.apply(selModel, arguments);
                },
                scope: sm
            }
        }
    });

但是，请记住，您将事件处理程序附加到重写的构造函数中的beforecellselect事件，因此，如果您在特定实例listeners的beforecellselect期间再次调用该事件处理程序函数，那么您将在一行中执行相同的函数两次。

出于效率考虑，您可以将自定义处理程序移动到Ext.grid.CellSelectionModel的原型中，即，而不是将customBeforeCellSelect放在init内部的单个实例上。执行以下操作使其成为可能:

    Ext.grid.CellSelectionModel.prototype.customerBeforeCellSelect =
        function(selModel, rowIndex, colIndex) {
            // etcetera
    };

您将在override语句之后添加上述行。