Question

我正在尝试使用分页创建一个表，似乎必须使用Ext.data.Store来完成。所以我用以下方式创建一个：

    /*
     createStore - setup an ExtJS dataStore and populate it using the view's collection
     @param n/a
     @return object store
     */
    createStore: function() {
        var _this = this;
        if (!this.store) {
            this.store = Ext.create('Ext.data.Store', {
                pageSize: 3,
                data: _this.collection.toJSON()
            });
        }
        return this.store;
    },

作为数据传递的作品（ _this.collection.toJSON（））如下：

    [
      {
        "id": 1,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 2,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 3,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 4,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 5,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 6,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 7,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 8,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 9,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 10,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 11,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 12,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 13,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 14,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 15,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 16,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 17,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 18,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 19,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 20,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      },
      {
        "id": 21,
        "value": 12.34,
        "currency": "eur",
        "expirationDate": "Mon Jul 27 2016 12:01:11 GMT+0100 (WEST)",
        "vendor": "banana",
        "activationCode": 1234567890
      }
    ]

但是在最终结果表中，ExtJS不会将结果限制为每页仅3个结果。

我搜索了the documentation并搜索了很多内容，但我无处可去。我还看到有人使用代理选项接收数据，并对服务器执行修改以使服务器支持分页。

我不能在这里做到这一点，我收到的数据是这样的，这样它将一直到最后因为我无法更改服务器。此外，由于前端GUI细节，更改后端服务器的逻辑是错误。

我该怎么办？这应该是直截了当的。 Store对象拥有它需要显示的所有数据，它只需要将它分成页面，这个世界上什么都没有，如果这样做的唯一方法就是修改服务器然后我不知道......

Answer 1

您好， 实际上Extjs不进行分页，你应该自己关心数据部分。

http://docs.sencha.com/extjs/6.0/6.0.1-classic/#!/api/Ext.toolbar.Paging

通常在服务器端处理分页（请参阅下面的例外）。客户端将参数发送到服务器端，服务器需要解释这些参数，然后使用适当的数据进行响应。

还有使用本地数据进行分页部分，但它看起来很旧。

最佳做法是设置一些服务器端，根据提供的参数生成数据部分。

如何在Sencha Ext.data.Store上创建分页？

1 个答案: