[英]Access nested object in react props
I have props in my child component like so我的子组件中有这样的道具
props in child:儿童道具:
myProps =
{
"url": "some url",
"child_tiers": [
{
"tier_type": 1,
"child_tiers": [
{
"tier_type": 2,
"lower": 1.0,
"upper": 4.0,
"child_tiers": [
{
"tier_type": 3,
"lower": 0.0,
"upper": 5.0,
"child_tiers": [
{
"tier_type": 4,
"lower": 1,
"upper": 100,
"values": {
"lowest": 85,
"highest": 95,
"multiplier": 18,
"tier": "deepest tier"
}
},
{
"tier_type": 4,
"lower": 100,
"upper": 200,
"values": {
"lowest": 185,
"highest": 195,
"multiplier": 118,
"tier": "deepest tier"
}
}
],
"values": null
}
],
"values": null
}
],
"values": null
}
],
"description": "Important Description"
}
These props are part of the state of the parent component (the state of the parent is being set by calling an API using fetch).这些道具是父组件的 state 的一部分(父组件的 state 是通过使用 fetch 调用 API 来设置的)。 I want to create 3 arrays one each for lowest, highest and multiplier values in the deepest tier.
我想创建 3 个 arrays ,每个用于最深层中的最低、最高和乘数值。 I am able to console log
this.props.myProps.url
/ this.props.myProps.description
/ this.props.myProps.child_tiers
but when I do this.props.myProps.child_tiers[0]
I get an error TypeError: Cannot read property '0' of undefined
.我可以控制台记录
this.props.myProps.url
/ this.props.myProps.description
/ this.props.myProps.child_tiers
但是当我这样做时this.props.myProps.child_tiers[0]
我收到错误TypeError: Cannot read property '0' of undefined
。 Is there a clean way to achieve this?有没有一种干净的方法来实现这一目标? Can I use Promise here?
我可以在这里使用 Promise 吗? Other suggested solutions of having the state as null didn't work for me.
将 state 作为 null 的其他建议解决方案对我不起作用。
This is how you could access the object with values lowest, highest and multiplier
这就是您可以使用
lowest, highest and multiplier
访问 object 的方式
myProps = { "url": "some url", "child_tiers": [ { "tier_type": 1, "child_tiers": [// { "tier_type": 2, "lower": 1.0, "upper": 4.0, "child_tiers": [// { "tier_type": 3, "lower": 0.0, "upper": 5.0, "child_tiers": [// { "tier_type": 4, "lower": 1, "upper": 100, "values": { "lowest": 85, "highest": 95, "multiplier": 18, "tier": "deepest tier" } }, { "tier_type": 4, "lower": 100, "upper": 200, "values": { "lowest": 185, "highest": 195, "multiplier": 118, "tier": "deepest tier" } } ], "values": null } ], "values": null } ], "values": null } ], "description": "Important Description" } o=myProps.child_tiers[0]["child_tiers"][0]["child_tiers"][0]["child_tiers"][0].values lowest=[{low:o.lowest}] highest=[{hight:o.highest}] multiplier=[{multiple:o.multiplier}] console.log(o) console.log(lowest,highest,multiplier)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.