Question

在我的ExtJS网格中，我使用以下代码声明bbar：

Ext.define('Ext.toolbar.PagingComboToolbar', {
  extend: 'Ext.PagingToolbar',
  resources: {
    displayMessage: Resources.Labels.Ext_Paging_DisplayMsg,
    emptyMessage: Resources.Labels.Ext_Paging_EmptyMsg
},
  displayInfo: true,
  enableOverflow: true,
  pageSize: 50,      
  initComponent: function () {
      var me = this;
      this.store.pageSize = this.pageSize;
      var combo = new Ext.form.ComboBox({
        name: 'perpage',
        width: 75,
        store: new Ext.data.ArrayStore({
            fields: ['id'],
            data: [
              ['10'],
              ['20'],
              ['50'],
              ['75'],
              ['100'],
              ['150']
            ]
        }),
        value: this.pageSize,
        listWidth: 70,
        triggerAction: 'all',
        displayField: 'id',
        valueField: 'id',
        editable: false,
        forceSelection: true,
        listeners: {
            select: {
                fn: function (combo, record) {
                    var newPagesize = parseInt(record.get('id'), 10);
                    this.pageSize = newPagesize;
                    this.store.pageSize = newPagesize;
                    this.store.loadPage(this.store.currentPage);
                },
                scope: this
            }
        }
    });

    Ext.apply(this, {
         displayMsg: this.resources.displayMessage,
         emptyMsg: this.resources.emptyMessage,
        items: [
            combo
        ]
    });

    this.callParent(arguments);
}
});

为了完整起见，这就是我在网格定义中声明这个类的方法：

bbar: Ext.create('Ext.toolbar.PagingComboToolbar', {
            store: store,
            enableOverflow: true,
 }),

请注意，这里需要注意的最重要的是我附加到分页机制的组合框。它允许您动态定义页面的大小。当网格未处于溢出模式时，这非常有效（我找不到更好的方法来描述它）。

一旦我将网格缩小，.x-toolbar-more-icon：在图标出现之前，点击此图标后组合框将显示在小菜单中。我仍然看到选项（10,20,50，...），我可以点击它们，但select事件不再被触发。如果我决定在任何给定点再次使网格更宽（宽度足以在网格中显示组合框并且不隐藏在“更多”按钮后面），则选择事件突然重新出现并且一切都再次完美。

话虽如此，原始（开箱即用）按钮仍然继续工作。例如，如果菜单中也存在刷新页面按钮，则单击该按钮将实际刷新网格。

这是显示问题的Fiddle。如果你玩网格的宽度，你将能够重现问题（例如400像素）

有什么想法吗？

Answer 1

看起来它是早期版本中也发生的常见错误：https://www.sencha.com/forum/showthread.php?308363

作为解决方法，您可以使用change事件代替select。检查您的Fiddle已修改。

PagingToolbar中的ExtJS 6组合框事件无法在溢出模式下工作

1 个答案: