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

Question

我很困惑为什么在尝试访问 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}]}

我可以看到数组“data”存在，但是当我尝试时:

    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 的日志。 。如果是这样，您可能需要在成功接收数据之前仔细检查阻止页面呈现的逻辑，因为我怀疑这就是您的问题所在。