我有一个包含 N 个对象的变量。对于每个对象,我希望将它们传递给一个子组件——因此我们也将有 N 个具有不同 Prop 的子组件。
家长:
renderBrandCards() {
const { marketData } = this.state;
let i = 0;
for (const stock in marketData){
i++;
return (
<BrandCard
key={i}
stock_name={stock}
stock_data={marketData[stock]}
/>
)
}
}
// .... render etc
return (
<ScrollView>
{this.renderBrandCards()}
</ScrollView>
)
但是,只有 marketDataMap
的第一个对象被传递给 BrandCard
组件并呈现。它不会循环。
我在这里使用 for ... in
是不是错了?
最佳答案
Am I using for ... in wrong here?
是的,因为您是在 for 循环的第一步 之后从函数返回。
您必须创建一个包含所有所需项目的数组,然后只需返回该数组。
let i = 0;
let brandCards = [];
for (const stock in marketData){
i++;
brandCards.push(
<BrandCard
key={i}
stock_name={stock}
stock_data={marketData[stock]}
/>
)
}
return brandCards;
但我建议您使用另一种方法,使用 map
方法。
return Object.keys(marketData).map(function(key, i){
return (<BrandCard key={i} stock_name={key} stock_data={marketData[key]}/>);
});
关于javascript - 为什么不 for ... in 在这里循环?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48238754/