javascript - 从单个商店动态创建多个 Sencha ExtJS 商店

Question

我开发了一个带有单个商店和网格的页面来显示数据库查询中的项目。此后，简报已扩展到包含通过拖放对网格中的项目进行动态分组。

已决定通过在客户端创建多个存储和网格来实现此功能，以便单个 GET 请求提供网格的所有条目。

加载初始“主存储”后，加载函数会迭代“主存储”中的数据并创建新存储(为所述存储挑选记录)以及每个存储的新网格。网格将具有根据内容动态生成的标题，但将具有简单的 id 来表示数据库中的组。

然后，用户根据需要将项目从每个网格拖放到其他网格中，从“旧”存储中删除该项目并在"new"存储中创建它，同时也更改其组 ID。

用户还可以创建新组，从而生成空白存储和随附的网格。

一旦进行更改，“主存储”中的数据就会被清除，然后每个存储都会聚合回“主存储”中，然后正常执行同步。

我相信在创建商店和网格时，我可以作为函数的一部分分配 id，将它们链接在一起并将它们与其他商店/网格区分开来，但我不知道如何获取唯一数据从“主商店”进入每个子商店。

这是看待这个问题的正确方式吗？目的是避免同一存储的多个实例并应用过滤器，因为这不一定会对组 id 进行任何更改，并避免多个存储以将查询服务器的开销保持在单个请求。

如果这是执行此操作的正确方法(至少是“a”，如果不一定是“the”)，那么如何从“主商店”设置新商店中的数据？我假设我可以迭代“主存储”中的记录，分配给一个数组，并以某种方式应用该数组作为数据源，但正如已经说过的，我不知道如何做到这一点。

示例型号和商店代码:

Ext.define('ConfirmationModel', {
    extend: 'Ext.data.Model',
    fields: [
        'GroupName',
        'ItemType',
        'ItemTypeId',
        'JobNo',
        'ItemNo',
        'Thickness',
        'Cutter',
        'CutterId',
        'Source',
        'Qty',
        'Material',
        'MaterialId',
        'Type',
        'TypeId',
        'Work',
        'WorkId',
        'InternalFinish',
        'ExternalFinish',
        'Notes',
        'Documented?',
        'ImportDate',
        'ImportCheck'
    ]
});

confirmationStore = Ext.create('Ext.data.Store',{
    id: 'confirmationStore',
    model: 'ConfirmationModel',
    autoLoad: true,
    proxy: {
        // load using HTTP
        type: 'ajax',
        url: '<?= $site_url ?>Production/ConfirmationJSON/<?php echo $job_no ?>',
        pageParam: false, //to remove param "page"
        startParam: false, //to remove param "start"
        limitParam: false, //to remove param "limit"
        noCache: false, //to remove param "_dc"
        reader: {
            type: 'json',
            model: 'ConfirmationModel'
        }
    },
    groupField: 'GroupName'
});

编辑:

我有一个“主存储”，在其中，每一行都有一个 GroupName，例如(为了简洁)“组 1”、“组 2”等。我需要从“主存储”生成，更多商店，每家看起来都像:

group1Store = Ext.create('Ext.data.Store',{
    id: 'Group 1',
    model: 'ConfirmationModel',
    autoLoad: false,
    proxy: {
        // load using HTTP
        type: 'memory',
        reader: {
            type: 'json'
        }
    }
});

group2Store = Ext.create('Ext.data.Store',{
    id: 'Group 2',
    model: 'ConfirmationModel',
    autoLoad: false,
    proxy: {
        // load using HTTP
        type: 'memory',
        reader: {
            type: 'json'
        }
    }
});
...
group#Store = Ext.create('Ext.data.Store',{
    id: 'Group #',
    model: 'ConfirmationModel',
    autoLoad: false,
    proxy: {
        // load using HTTP
        type: 'memory',
        reader: {
            type: 'json'
        }
    }
});

这些存储将仅包含与该组相关的记录。我的想法是首先迭代“主存储”并将所有唯一的组名称检索到一个数组中，然后为每个组名称创建一个数组，并从“主存储”中仅推送其组名称匹配的记录。

从那里创建一个多维数组，首先保存组名称，然后保存该组名称的记录数组，然后生成商店并设置 name/id/storeId = group[0] 和 data = group[1 ]。也许很啰嗦，但无论组的数量有多少，都应该生成所需的所有商店。

Answer 1

    createStoreClone: function(sourceStore){
        var targetStore = Ext.create('Ext.data.Store', {
          model: sourceStore.model
        });
        var records = [];
        Ext.each(sourceStore.getRange(), function(record){
            if(your_condition){//push record to array when condition is true
               records.push(record.copy());
        });
        targetStore.add(records);
        return targetStore;
    }

在主存储的加载事件上使用此函数。希望这是有道理的!!