在react props中访问嵌套对象

时间:2020-07-13 21:32:46

标签: javascript reactjs

我的子组件中有道具,像这样

儿童道具:

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"
}

这些道具是父组件状态的一部分(通过使用fetch调用API来设置父状态)。我想创建3个数组,每个数组用于最深层中的最低,最高和乘数。 我可以控制台日志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。 有没有一种干净的方法来实现这一目标?我可以在这里使用Promise吗? 其他建议的将状态设为null的解决方案对我不起作用。

1 个答案:

答案 0 :(得分:0)

这是您可以使用值Date32[Day]

访问对象的方法

lowest, highest and multiplier