如何解决 ExtJS 4.1 Combobox pageSize 的 bug？

Posted 2023-02-26

【中文标题】如何解决 ExtJS 4.1 Combobox pageSize 的 bug？

【英文标题】：How can solve ExtJS 4.1 Combobox pageSize bug?

【发布时间】：2013-04-23 08:46:12

【问题描述】：

我们有一个 ExtJS v4.1 组合框，我们已经将它绑定到一个商店并设置它的 pageSize 配置如下：

var myStore = Ext.create('Ext.data.Store', 
    model: 'User',
    remoteFilter: true,
    remotePaging: true,
    autoLoad: true
    proxy: 
        type: 'ajax',
        url: '/users.json',
        reader: 
            type: 'json',
            root: 'users'
        
    ,
    pageSize: 50,                  //   <= store pageSize
);

Ext.create('Ext.form.ComboBox', 
    fieldLabel: 'Choose',
    store: myStore,
    queryMode: 'remote',
    displayField: 'Name',
    valueField: 'Id',
    pageSize: 20                   //   <= combobo pageSize
);

作为documentation says，组合框的pageSize属性应该用于过滤queryMode='remote'时发送到服务器的ajax查询。但我们看到的是相反的，它只是用于在组合框底部显示一个分页工具栏（文档的第一条评论是这样说的）。

但是在这种特定情况下，我们真正需要的是覆盖商店的pageSize 属性，并使组合框的pageSize 属性用于过滤ajax 请求。

我们如何在组合框中实现/扩展这样的功能？我们如何在组合框中覆盖 store 的 pageSize 属性？

【参考方案1】：

comboBox 中的 pageSize 实际上是一个真/假值，尽管有文档。

在javascript中，如果为0，分页工具栏关闭，否则打开。

这是一个共享存储，还是仅用于组合框？

如果共享，那么您将需要保存商店的页面大小，必要时为组合更改它，然后重新设置：

            
                xtype: 'combobox',
                width: 350,
                store: new MyStore(),
                fieldLabel: 'Label',
                pageSize: 2,
                listeners:
                    beforequery:function(queryEvent)
                        var combo = queryEvent.combo;
                        var store = combo.getStore();
                        var oldPageSize = store.pageSize;
                        store.on('load', function()
                            this.pageSize = oldPageSize;
                        );
                        store.pageSize = combo.pageSize;
                    
                
            

【讨论】：

谢谢尼尔，好主意。我通过覆盖其商店解决了仅针对非共享商店的问题。但我认为您的解决方案适用于共享和非共享商店。我说的对吗？

【参考方案2】：

另一种方法是在实例化时将参数/配置添加到存储中。这是我的做法

store: new Ext.create('MyStore',pageSize:20),
pageSize: true

【讨论】：

谢谢，但是当我们在组合配置上使用 sencha mvc 时，我们只写商店名称而不实例化它。你有什么解决办法吗？

是的，我也使用 Sencha MVC。如果你有 Store，例如 Ext.define ('MyCompany.store.MyStore', ...)。我们可以写在combostore: new Ext.create ('MyCompany.store.MyStore', PageSize: 12)