如果对象键存在于另一个数组中,则在重新选择选择器中使用键控对象扩充对象
In Reselect selector augment object with keyed objects if object key exist in another array
正在尝试学习一个概念。
如果我有键控对象的对象和键数组。
const orders = {
"key1" : { id: "key1", number: "ORD001" },
"key3" : { id: "key3", number: "ORD003" },
"key2" : { id: "key2", number: "ORD002" },
};
和一个数组:
const selectedOrders = ["key1","key2"];
并借助 Redux Reselect
。我想要一个像这样的新对象:
const orders = {
"key1" : { id: "key1", number: "ORD001" selected: true},
"key3" : { id: "key3", number: "ORD003" selected: false },
"key2" : { id: "key2", number: "ORD002" selected: true },
};
所以稍后我可以通过 Object.keys(this.orders)
迭代该对象并设置所选项目的样式。
对此类用例使用 Reselect 是否正确?如果是,那么我应该如何以一种有效且惯用的方式签入,外部数组是否包含给定的键?
如果这个想法对于这样的用例是完全错误的,那么我应该如何以正确的方式做到这一点?
附录:也可能有另一个数组,其中包含按顺序显示这些订单的键。 (用户能够重新订购商品)。
P.S。我不想为 orders
集合使用对象数组。
是的,您可以使用重新选择来合并两组数据以生成第三组数据。由于reselect的memoization,如果输入没有变化,那么计算只需要执行一次。
// You'll need some input selectors to pluck the raw orders from your redux store.
// I'm making these up, since i don't know how your store is arranged.
const getOrders = (state) => state.orders;
const getSelectedOrders = (state) => state.selectedOrders;
const getAugmentedOrders = createSelector(
[getOrders, getSelectedOrders],
(orders, selectedOrders) => {
const augmentedOrders = {};
Object.keys(orders).forEach(key => {
augmentedOrders[key] = {
...orders[key],
selected: selectedOrders.includes(key),
}
});
return augmentedOrders;
}
);
如果你有很多选择的订单,那么每次循环都做selectedOrders.includes
可能是一个性能问题。在那种情况下,我会创建一组 selectedOrders,因为对该组的查找将是恒定时间。
(orders, selectedOrders) => {
const selectedSet = new Set(selectedOrders);
const augmentedOrders = {};
Object.keys(orders).forEach(key => {
augmentedOrders[key] = {
...orders[key],
selected: selectedSet.has(key),
}
});
return augmentedOrders;
}
正在尝试学习一个概念。 如果我有键控对象的对象和键数组。
const orders = {
"key1" : { id: "key1", number: "ORD001" },
"key3" : { id: "key3", number: "ORD003" },
"key2" : { id: "key2", number: "ORD002" },
};
和一个数组:
const selectedOrders = ["key1","key2"];
并借助 Redux Reselect
。我想要一个像这样的新对象:
const orders = {
"key1" : { id: "key1", number: "ORD001" selected: true},
"key3" : { id: "key3", number: "ORD003" selected: false },
"key2" : { id: "key2", number: "ORD002" selected: true },
};
所以稍后我可以通过 Object.keys(this.orders)
迭代该对象并设置所选项目的样式。
对此类用例使用 Reselect 是否正确?如果是,那么我应该如何以一种有效且惯用的方式签入,外部数组是否包含给定的键?
如果这个想法对于这样的用例是完全错误的,那么我应该如何以正确的方式做到这一点?
附录:也可能有另一个数组,其中包含按顺序显示这些订单的键。 (用户能够重新订购商品)。
P.S。我不想为 orders
集合使用对象数组。
是的,您可以使用重新选择来合并两组数据以生成第三组数据。由于reselect的memoization,如果输入没有变化,那么计算只需要执行一次。
// You'll need some input selectors to pluck the raw orders from your redux store.
// I'm making these up, since i don't know how your store is arranged.
const getOrders = (state) => state.orders;
const getSelectedOrders = (state) => state.selectedOrders;
const getAugmentedOrders = createSelector(
[getOrders, getSelectedOrders],
(orders, selectedOrders) => {
const augmentedOrders = {};
Object.keys(orders).forEach(key => {
augmentedOrders[key] = {
...orders[key],
selected: selectedOrders.includes(key),
}
});
return augmentedOrders;
}
);
如果你有很多选择的订单,那么每次循环都做selectedOrders.includes
可能是一个性能问题。在那种情况下,我会创建一组 selectedOrders,因为对该组的查找将是恒定时间。
(orders, selectedOrders) => {
const selectedSet = new Set(selectedOrders);
const augmentedOrders = {};
Object.keys(orders).forEach(key => {
augmentedOrders[key] = {
...orders[key],
selected: selectedSet.has(key),
}
});
return augmentedOrders;
}