Javascript React JS-将对象和数组中的信息作为道具传递给子组件

我有一个像这样的对象：

storeObjects = {
    furnitures: [{name: 'table', price: 50}, {name: 'chair', price: 20}],
    electronics: [{name: 'tv', price: 150}]
}

<ChildComponent name = 'table' price = 50 color = 'brown' />
<ChildComponent name = 'chair' price = 20 color = 'brown' />
<ChildComponent name = 'tv' price = 150 color = 'yellow' />

我还有一系列的颜色：

['brown', 'yellow', 'green', 'red']

现在我想通过这个对象和数组来创建子组件，并将这些信息作为道具。我想得到这样的东西：

storeObjects = {
    furnitures: [{name: 'table', price: 50}, {name: 'chair', price: 20}],
    electronics: [{name: 'tv', price: 150}]
}

<ChildComponent name = 'table' price = 50 color = 'brown' />
<ChildComponent name = 'chair' price = 20 color = 'brown' />
<ChildComponent name = 'tv' price = 150 color = 'yellow' />

---

我的观点是，来自第一个键的元素将获得第一种颜色，来自第二个键的元素将获得第二种颜色，依此类推，您可以使用带有索引的

map

let colors = ['brown', 'yellow', 'green', 'red']
Object.keys(storeObjects).map((key, index) => {
    storeObjects[key].map((obj) => {
        console.log(obj.name, obj.price, colors[index])
    })
})

storeObjects={
家具：[
{名称：“表”，价格：50}，
{名称：“主席”，价格：20}，
],
电子产品：[{名称：“电视”，价格：150}]，
}
颜色=[“棕色”、“黄色”、“绿色”、“红色”]
const res=Object.key（storeObjects）
.map（（商店，i）=>
storeObjects[store].map（（项）=>({
…项目，
颜色：颜色[i]，
}))
)
.flat（）
console.log（res）

您可以使用带有索引的

map

storeObjects={
家具：[
{名称：“表”，价格：50}，
{名称：“主席”，价格：20}，
],
电子产品：[{名称：“电视”，价格：150}]，
}
颜色=[“棕色”、“黄色”、“绿色”、“红色”]
const res=Object.key（storeObjects）
.map（（商店，i）=>
storeObjects[store].map（（项）=>({
…项目，
颜色：颜色[i]，
}))
)
.flat（）
log（res）

首先遍历“storeObjects”的键，然后遍历该键的数组

让storeObjects={
家具：[{名称：桌子，价格：50}，{名称：椅子，价格：20}]，
电子产品：[{名称：'tv'，价格：150}]
}
让颜色=[‘棕色’、‘黄色’、‘绿色’、‘红色’]；
让newStoreObj={}；
设指数=0；
用于（输入storeObjects）{
newStoreObj[key]=storeObjects[key]；
for（设i=0；i首先遍历“storeObjects”的键，然后遍历该键的数组



让storeObjects={
家具：[{名称：桌子，价格：50}，{名称：椅子，价格：20}]，
电子产品：[{名称：'tv'，价格：150}]
}
让颜色=[‘棕色’、‘黄色’、‘绿色’、‘红色’]；
让newStoreObj={}；
设指数=0；
用于（输入storeObjects）{
newStoreObj[key]=storeObjects[key]；
对于（设i=0；我为什么不向对象添加颜色键而不是单独的数组？@BlackMath我从不同的源获取对象和数组，这就是它们分开的原因为什么不向对象添加颜色键而不是单独的数组？@BlackMath我从不同的源获取对象和数组，这就是它们分开的原因