事件定製容器煎茶觸摸

Question

自定義組件處理

Ext.define('MyApp.view.colorSelect', { 
    extend: 'Ext.Container', 
    xtype: 'colorselect', 
    colorStore: '', 

    initialize: function() { 
    this.callParent(arguments); 

    this.colorSelectField = Ext.create('Ext.field.Select', { 
     label: 'Color', 
     options: [], 
     listeners: { 
     initialize: function() { 
      scope:this, 
      this.fireEvent('colorSelectFieldInit', this); 
     } 
     } 
    }); 
    this.add([this.colorSelect, otherItem1, otherItem2]); 
    Ext.Viewport.fireEvent('colorSelectInitAction', this); 
    } 
}); 

控制器

Ext.define('MyApp.controller.colorSelect', { 
    extend: 'Ext.app.Controller', 
    config: { 
    refs: { 
     colorSelect : 'colorselect' 
    } 
    }, 
    onColorSelectInitAction: function() { 

    var colorselect = this.getColorSelect(); 
    this.colorselect.on({ 
     scope: this, 
     colorSelectFieldInit: this.colorSelectFieldInitAction 
    }); 
    }, 

    colorSelectFieldInitAction: function(comp) { 
    var store = comp.colorStore 
    console.log(store); 
    comp.setOptions(
     this.fillterStore(store) 
    ); 
    }, 

    fillterStore: function(store) { 
    }, 

    launch: function() { 
    this.callParent(); 
    Ext.Viewport.on({ 
     scope: this, 
     colorSelectInitAction: this.onColorSelectInitAction 
    }); 
    } 
}); 

需要在主容器創建自定義組件的部分實例

this.firstColor = Ext.create('MyApp.view.colorSelect', { 
colorStore:'abc' 
    }); 

this.secondColor = Ext.create('MyApp.view.colorSelect', { 
colorStore:'def' 
    }); 

this.thirdColor = Ext.create('MyApp.view.colorSelect', { 
colorStore:'xyz' 
    }); 

this.add([this.firstColor,this.secondColor,this.thirdColor]); 

我想知道什麼是我爲了不顯示console.log而在colorSelectFieldInitAction中添加的錯誤。 我需要過濾這些自定義組件中的相應商店，並將它們設置爲選項來選擇字段。

Answer 1

嘗試從組件this.fireEvent('colorSelectInitAction', this);而不是Ext.Viewport.fireEvent('colorSelectInitAction', this);嘗試點火事件。 然後添加監聽器：

this.colorselect.on({ 
     scope: this, 
     colorSelectFieldInit: this.colorSelectFieldInitAction, 
     colorSelectInitAction: this.onColorSelectInitAction 
}); 

我不能測試它自己，但它應該工作。