idや何かのようなキーを含むオブジェクトの配列を返すreducerが定義されているとします。配列内の特定のIDを持つ特定のオブジェクトを取得/検索するための還元的な方法は何ですか。配列そのものには、複数の配列を含めることができます。レキシブストア内のアイテムをキーで取得するにはどうすればよいですか?
{ items:[id:1,...],cases:{...}}
idでレコード/ノードを探すにはどうすればいいですか?
idや何かのようなキーを含むオブジェクトの配列を返すreducerが定義されているとします。配列内の特定のIDを持つ特定のオブジェクトを取得/検索するための還元的な方法は何ですか。配列そのものには、複数の配列を含めることができます。レキシブストア内のアイテムをキーで取得するにはどうすればよいですか?
{ items:[id:1,...],cases:{...}}
idでレコード/ノードを探すにはどうすればいいですか?
reduxでこれを行う特別な方法はありません。これは単純なJSタスクです。
function mapStoreToProps(store) {
function findMyInterestingThingy(result, key) {
// assign anything you want to result
return result;
}
return {
myInterestingThingy: Object.keys(store).reduce(findMyInterestingThingy, {})
// you dont really need to use reduce. you can have any logic you want
};
}
export default connect(mapStoreToProps)(MyComponent)
よろしく
は私がlodashのようなライブラリを使用したい::
var fred = _.find(users, function(user) { return user.id === 1001; });
それは価値があることに注意されるかもしれないが、私は同様に反応し、使用すると仮定しますストア内のオブジェクトを優先してオブジェクトを優先させる(特に大きな状態のツリーの場合)ための良い方法と見なされます。この場合には、あなたはキーとして(例えば)idを持つオブジェクト内のアイテムを保存したい:
{
'1000': { name: 'apple', price: 10 },
'1001': { name: 'banana', price: 40 },
'1002': { name: 'pear', price: 50 },
}
これは選択が容易になり、しかし、あなたはロード時に状態の形状を手配しなければなりません。
このようなデータを保存する完全な方法は、還元剤のオブジェクトにbyId
とを格納することです。あなたのケースでは
それは次のようになります。
{
items: {
byId : {
item1: {
id : 'item1',
details: {}
},
item2: {
id : 'item2',
details: {}
}
},
allIds: [ 'item1', 'item2' ],
},
cases: {
byId : {
case1: {
id : 'case1',
details: {}
},
case2: {
id : 'case2',
details: {}
}
},
allIds: [ 'case1', 'case2' ],
},
}
参考:http://redux.js.org/docs/recipes/reducers/NormalizingStateShape.html
これは、両方の維持だけでなく、データを使用するための正規化された状態を維持するのに役立ちます。
このようにすると、すべての配列を繰り返し処理してレンダリングすることが容易になります。オブジェクトをIDだけ取得する必要がある場合は、配列全体を反復する代わりにO(1)
操作になります。
これはすばらしそうに見えますが、コードペンなどはありますか? –