重新定義ExtJS事件並委託到之前的實現

我已經繼承了一個大的ExtJS3代碼庫，並且在cellselect之前有一個Ext.grid.CellSelectionModel的「基本」重寫。我截取的代碼龐大的大片，但本應提供的總體思路：重新定義ExtJS事件並委託到之前的實現

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-y的方式嗎？

來源

2011-10-26 George Jempty

監聽器被添加（可以看到監聽器位於您提到的監聽器數組中），而不是被替換，因此您不需要執行任何操作即可調用原始監聽器。所有聽衆應該在事件發生時接到電話。我想可能有一些錯誤。 – pakman

在你的情況，如果你知道它會是將構造以外使用的功能，我建議將事件處理函數作爲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語句後添加上述行。

來源

2011-10-27 06:11:03 Ryan

我懷疑這是另一種方法，它絕對不易碎。這是我第一個半周的合同，但我希望在他們看到我修改基本覆蓋之前發展一定程度的信心。我們會看看其他人是否以另一種方式回答，但如果不是，我應該在短時間內接受你的回答。 –

我忘了在原始答案中考慮到效率。我已經更新了答案來解釋這一點。增加是在答案的底部。 :) – Ryan

重新定義ExtJS事件並委託到之前的實現

回答

相關問題