即使它打印在 console.log 中，我也无法映射对象数组答案

【问题标题】：I cant map array of objects eventhough it's printed in console.log即使它打印在 console.log 中，我也无法映射对象数组
【发布时间】：2020-10-11 22:54:56
【问题描述】：

我正在尝试映射一组对象，但它一直说文档未定义，即使我可以在 console.log 中清楚地看到它

这是我在 console.log

时得到的

{console.log(this.props.results.data)}

我想要的是 docs 字段。如果我展开它看起来像这样

因为我想打印文档的内容，所以我尝试这样做

<div className='list-render'>
   {this.props.results.loading ? <LoadingSpinner/> : 
      <div className='row'>
         {(this.props.results.data.docs.map((data) => { // code to print individual fields )}
      </div>
   </div>}
</div>

我得到 TypeError: this.props.results.data.docs is undefined 我正在使用 mongoose-paginate-v2 库进行分页

【问题讨论】：

试试{(this.props.results.data && this.props.results.data.docs.map((data) => { // code to print individual fields )}
还是说同样的话
那么结果不可用（还）。将您的 console.log() 更改为 console.log(JSON.stringify(this.props.results)) 并检查输出。更好的选择是添加minimal reproducible example，这样我们就可以重现问题。
正如@Andreas 已经提到的，我之前也遇到过这个问题..如果您更新数组中的任何值，您在控制台中看到的值可能在当前时间不存在，它将反映在我认为以前的日志也是由于参考。

标签： javascript arrays reactjs mongoose redux

【解决方案1】：

您需要检查docs 属性是否未定义。您可以通过以下几种方式做到这一点：

您可以使用可选链接来检查属性是否不是null 或undefined。然后您的代码将如下所示this.props.results.data?.docs.map...。 Here's how you add it to your react app（但如果您使用的是最新的 babel 版本 - 它应该可以开箱即用）
你自己做检查。正如评论中所建议的，最基本的是检查属性是否为假：

this.props.results.data.docs && this.props.results.data.docs.map((data)

评论有点不正确，你不需要检查data是否是假的（只有当错误指向那个时），你检查docs是否是假的。

【讨论】：

您可以使用optional chaining：this.props.results.data?.docs.map