web-dev-qa-db-ja.com

ExtJS 4：ストアのクローン作成

古い参照を保持せずに_Ext.data.Store_のクローンを作成する方法を理解しようとしています。

いくつかのコードでよりよく説明しましょう。ソースストアは次のとおりです。

_var source = Ext.create ('Ext.data.Store', {
    fields: ['name', 'age'] ,
    data: [
        {name: 'foo', age: 20} ,
        {name: 'boo', age: 30} ,
        {name: 'too', age: 10} ,
        {name: 'yoo', age: 80} ,
        {name: 'Zoo', age: 30}
    ]
});
_

私がやりたいことの例に従います：

_var target = source;
target.removeAll ();
// Here I need to have target empty and source unchanged
// But in this case, source is empty as well
_

さて、上記の例では、コピーは参照によって行われますが、値によって行う必要があります。そのため、ドキュメントでExt.clone ()を見つけましたが、_Ext.data.Store_のような複雑なオブジェクトでは機能しないようです。

_var target = Ext.clone (source);
target.removeAll ();
// source is still empty
_

それから私はExt.data.Model.copy ()で試しましたが、それを機能させる唯一の方法はこれです：

_var target = Ext.create ('Ext.data.Store', {
    fields: ['name', 'age']
});

source.each (function (model) {
    target.add (model.copy ());
});
_

さて、私の理由で、別の_Ext.data.Store_をインスタンス化したくないので、これを避けたいと思います。

_var target = Ext.create ('Ext.data.Store', {
    fields: ['name', 'age']
});
_

私はこのようなものが欲しいです：

_var target;

source.each (function (model) {
    target.add (model.copy ());
});
_

しかし、明らかに、それは機能しません。

では、どうすればソースストアのクローンを作成できますか？

javascriptextjsmodelextjs4store
14
Wilk

ExtJS 3.xソリューション

これを試して：

cloneStore : function(originStore, newStore) {

    if (!newStore) {
        newStore = Ext.create('Ext.data.Store', {
            model : originStore.model
        });
    } else {
        newStore.removeAll(true);
    }

    var records = [], originRecords = originStore.getRange(), i, newRecordData;
    for (i = 0; i < originRecords.length; i++) {
        newRecordData = Ext.ux.clone(originRecords[i].copy().data);
        newStore.add(new newStore.model(newRecordData, newRecordData.id));
    }

    newStore.fireEvent('load', newStore);

    return newStore;
}

注意： Ext.ux.cloneは、オブジェクトのdeepクローンを作成する分離されたプラグインです（これが見つかります）。たぶん、Ext JS 4はおなじみのものを提供しますが、私にはわかりません。ExtJS3.x以降、この特別なクローンを使用しています。

新しいストアを作成するときにプロキシmemoryを指定する必要がある可能性があります（私は常に「提供された」方法を使用しているため、現時点ではわかりません。

ExtJS 4.xソリューション

function deepCloneStore (source) {
    var target = Ext.create ('Ext.data.Store', {
        model: source.model
    });

    Ext.each (source.getRange (), function (record) {
        var newRecordData = Ext.clone (record.copy().data);
        var model = new source.model (newRecordData, newRecordData.id);

        target.add (model);
    });

    return target;
}
12
knalli

ExtJS 6.x、5.x、4.xソリューション

これがほぼすべてのExtJSバージョンのソリューションです。 record.copyはすでにデータのクローンを作成していることに注意してください。再度Ext.cloneする必要はありません。

function deepCloneStore (source) {
    source = Ext.isString(source) ? Ext.data.StoreManager.lookup(source) : source;

    var target = Ext.create(source.$className, {
        model: source.model,
    });

    target.add(Ext.Array.map(source.getRange(), function (record) {
        return record.copy();
    }));

    return target;
}
10
Christiaan Westerbeek

私はExt.js4.1で次のことを成功させました：

var source = Ext.create('Ext.data.Store', {
    fields: ['name', 'age'],
    data: [
        {name: 'foo', age: 20},
        {name: 'boo', age: 30},
    ],
});

メソッドの場合：

cloneStore: function (source) {
    var clone = Ext.create('Ext.data.Store', {
        fields: ['name', 'age']
    });

    // load source store data
    clone.loadData(source.data.items);

    return clone;
}

列をなして：

var clone = Ext.create('Ext.data.Store', {
    fields: ['name', 'age']
}).loadData(source.data.items);
1
TriumphST

これはまだ私が探していたものであり、上記の答えは私にとってそれを修正しなかったので、私は自分で別の解決策を見つけました：

var target = Ext.create ('Ext.data.Store', {
    // add other properties here if needed
    reader: source.reader
})

これは、ストアのクローンを作成するのに役立ちました。

0
Allie