Question

无法访问对象中的对象数组

2020-05-06

1518

javascript arrays json reactjs object

我很困惑为什么在尝试访问 ReactJS 中对象内的数组时会出现错误。

我正在使用 Redux 将对象存储在 State 中。

我有一个允许页面呈现的成功函数，因此当我到达此对象时，它肯定已经加载。（我注意到大量与此类似的问题，通常都是这个问题）。

当我这样做时，我得到了正确的结果：

const { events } = this.props
console.log(JSON.stringify(events.listSignup))

{"data":[{"eventID":"264712106049274377","name":"BookOne","email":null,"verify":null,"privacy":null,"order":null,"group":null},{"eventID":"264712106049274377","name":"BookTwo","email":null,"verify":null,"privacy":null,"order":null,"group":null}]}

我可以看到数组“数据”存在，但是当我尝试：

    console.log(JSON.stringify(events.listSignup.data[0].name))

或

    console.log(JSON.stringify(events.listSignup.data[0]))

我得到“TypeError：无法读取未定义的属性‘数据’”

我绞尽脑汁想弄清楚发生了什么。任何建议都将不胜感激！

Answer 1

您感到困惑是对的，因为您 [认为您] 观察到的事情是不可能的。

作为一名开发人员，我经常遇到这种情况，我的建议是，当这种情况发生时，相信您的知识（您知道这是不可能的！）并仔细检查您所看到的内容。

我怀疑您的组件第一次渲染时， this.props.events 为 undefined ，但随后它很快重新渲染并设置了 this.props.events 。

我建议加回此行（不添加其他行）：

console.log(JSON.stringify(events.listSignup))

并在您的 javascript 控制台中向上滚动以查看是否有任何仅显示 undefined 的日志。如果是这样，您可能需要在成功接收数据之前仔细检查阻止页面呈现的逻辑，因为我怀疑这就是您的问题所在。