javascript - Ext.apply 不适用于 ExtJS 中的监听器

Question

我有这个 fiddle

http://jsfiddle.net/beQtF/1/

现在如果我直接在元素中编写监听器代码就可以了

如果应用它就不会起作用

 Ext.apply(cbox, {
       listeners: {
           'select': function (combo, record, index) {
               alert(combo.getValue());
           }
       }
   });

上面的代码不起作用

Answer 1

在 Ext.JS 中，监听器是在构造函数中添加的，因此您无法在组件创建后对其进行配置。您可以单独创建 ComboBox 配置，为其应用一组新的监听器，并创建一个具有扩展配置的 ComboBox，如下所示:

var comboConfig = {
        id: 'searchInput',
        fieldLabel: 'Search:',
        enableKeyEvents: true,
        submitEmptyText: false,
        emptyText: 'search...',
        valueField: 'abbr',
        displayField: 'name',
        width: '100%',
        store: {
           fields: ['abbr', 'name'],
           data: [{
               "abbr": "AL",
                   "name": "Alabama"
           }, {
               "abbr": "AK",
                   "name": "Alaska"
           }, {
               "abbr": "AZ",
                   "name": "Arizona"
           }]
        }
};   

Ext.apply(comboConfig, {
   listeners: {
       'select': function (combo, record, index) {
           alert(combo.getValue());
       }
   }
});

var cbox = Ext.create('Ext.form.field.ComboBox', comboConfig);
Ext.create('Ext.form.Panel', {
    items: [cbox],
    frame: true,
    renderTo: Ext.getBody()
});

或者，作为 CD pointed out ，您可以使用 on 函数添加它们:

cbox.on({
    select: function(combo, record, index) {
        alert(combo.getValue());
    }
});