如何获得盖茨比的非缩小反应错误

Question

尝试运行 gatsby build 并收到此错误消息。

失败我们遇到了一个错误：Minified React 错误 #31；访问https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7Bid%2C%20frontmatter%2C%20parent%7D 获取完整信息 消息或使用未缩小的开发环境来获取完整错误和其他有用的警告。

要查看我尝试过的完整消息： "GATSBY_ENV=development && gatsby build --no-uglify" 但这并没有改变。

在 reactjs.org 留言

对象作为 React 子对象无效（发现：对象带有键 {id, frontmatter, parent}）。如果您打算渲染一组子项，请改用数组。

这个项目中的许多对象都有这些键，所以我无法找到问题所在。

谁能给点建议？

Answer 1

这不是 Gatsby 错误，而是 React。

如果您不知道问题出在哪里，请想象一下。通常，这种错误与您尝试呈现对象而不是该对象的属性的方式有关，通常在循环中。例如：

const users= [
  {name: 'User 1', surname: 'Surname 1'},
  {name: 'User 2', surname: 'Surname 2'},
  {name: 'User 3', surname: 'Surname 3'},
]

users.map(user=>{
   return `the user is ${user}`
})

上面的 sn-p 将抛出与您描述的相同的异常，因为 user 是 React 无法推断或渲染的对象。你应该这样做：

const users= [
  {name: 'User 1', surname: 'Surname 1'},
  {name: 'User 2', surname: 'Surname 2'},
  {name: 'User 3', surname: 'Surname 3'},
]

users.map(user=>{
   return `the user name is ${user.name}`
})

这个 sn-p 是有效的，因为 user.name 是一个有效的返回类型（字符串），而不是一个对象。