Reactjs React setState导致一个；无法呈现对象“；错误

我有一个简单的带表单的statefull组件

export class example extends React.Component {
  constructor() {
    this.state = {
      issue: {id: '', isValid: false}
    }
    this.onSubmit = this.onSubmit.bind(this)
  }

  onSubmit (e) {
    fetch('/some/api/path').then((newIssue) => {
      newIssue.json().then(convertedIssue => {
        this.setState({issue: convertedIssue})  
      })
    })
  }

  render() {
    const issue = this.state.issue
    return (
      <div>
        <form onSubmit={this.onSubmit}>
          ID: {issue.id}
          ...
        </form>
      </div>
     )
   }

导出类示例扩展了React.Component{
构造函数（）{
此.state={
问题：{id:''，isValid:false}
}
this.onSubmit=this.onSubmit.bind（this）
}
提交（e）{
获取（'/some/api/path'）。然后（（新问题）=>{
newIssue.json（）.then（convertedIssue=>{
this.setState（{issue:convertedIssue}）
})
})
}
render（）{
const issue=this.state.issue
返回(
ID:{issue.ID}
...
)
}

当我得到API响应时，问题就出现了。响应是一个简单的对象，映射了初始化构造函数中状态的问题对象。当我尝试调用

setState（{issue:issue}）

时，我得到了错误：

Uncaught（in promise）错误：对象作为React子对象无效（发现：Sun Nov 06 2016 16:00:00 GMT-0800）（PST））。如果要呈现子对象集合，请改用数组。

我可以通过将调用从

setState（{issue:newIssue}）

更改为

setState（{newIssue}）

---

这是为什么？我做错了什么？

问题不在于您将对象分配给

this.state.issue的值，这是有效的

错误消息表示您正试图在组件或子组件中的某个位置呈现
this.state.issue
的值。但是React不会直接呈现对象

如果你做了类似的事情

render() {
 return <div>{this.state.issue}</div>
}

我分解
this.state.issue
并直接在JSX中呈现该数据。这可能是原因吗？是的，这会导致错误。因此类似
const{issue}=this.state
的内容，然后尝试呈现
{issue}
将引发错误。请选择一个要显示的问题，如
issue.id
如果要查看整个对象，可以在分解后呈现
{JSON.stringify（issue）}
。
render() {
  return (
    <span>Issue Id: {this.state.issue.id}</span>
  )
}