Javascript 在组件状态下从API调用保存和删除对象

我开始使用React，我尝试调用一个api，该api返回一个对象，并通过将结果保存到状态来打印结果。但就信息所说，我在国家的初始化中遗漏了一些东西

这就是我正在做的：

const apiAddress = 'https://jsonplaceholder.typicode.com/posts/1';
class Caller extends React.Component {
  constructor(props) {
        super(props)
      this.state = { scene: ""}
  }
  ComponentWillMount () {
    fetch(apiAddress)
      .then((response) => {
        return response.json()
      })
      .then((resource) => {
        console.log(resource);
        this.setState({ scene: resource })
      });
  }
  render() {
    return (
      <div>
        Res: {this.state.scene}
      </div>
    )
  }
}

ReactDOM.render(
  <Caller />,
  document.getElementById('root')
);

我得到的错误是：

对象作为React子对象无效（找到：具有键的对象 {userId，id，title，body}）。如果要呈现一组 子级，请改用数组

---

看起来您正在尝试渲染一个原始对象，我认为在React中渲染子对象时该对象无效

尝试分别打印对象值：

...
render() {
    const { userId, id, title, body } = this.state.scene
    return (
      <>
        <div> User ID: {userId}</div>
        <div> Id: {id}</div>
        <div> Title: {title}</div>
        <div> Body: {body}</div>
      </>    
   )
}
...

。。。
render（）{
const{userId，id，title，body}=this.state.scene
返回(
用户标识：{userId}
Id:{Id}
标题：{Title}
正文：{Body}
)
}
...

看起来您正在尝试渲染一个原始对象，我认为在React中渲染子对象时，这是无效的

尝试分别打印对象值：

...
render() {
    const { userId, id, title, body } = this.state.scene
    return (
      <>
        <div> User ID: {userId}</div>
        <div> Id: {id}</div>
        <div> Title: {title}</div>
        <div> Body: {body}</div>
      </>    
   )
}
...

。。。
render（）{
const{userId，id，title，body}=this.state.scene
返回(
用户标识：{userId}
Id:{Id}
标题：{Title}
正文：{Body}
)
}
...

它成功了。我认为默认情况下，toString（）方法是理所当然的。我错了吗？我只能把字符串放在{}中，不是吗？@Xhark React文档没有提到JSON对象，在JSX的目录中可以看到空值、数字、布尔值和函数也可以是有效的子对象，而原始对象则不是。然而，您可以轻松地创建一个组件来打印任何内容，例如，无法启动状态参数作为对象？因为我认为我初始化state.scene变量的方法是不够的，但我不确定应该怎么做。@Xhark如果你确实可以作为一个对象初始化状态参数，你只需要正确地渲染这些参数，如果你想要一个快速的解决方案，请使用

JSON.stringify（this.state.scene）

。我认为默认情况下，toString（）方法是理所当然的。我错了吗？我只能把字符串放在{}中，不是吗？@Xhark React文档没有提到JSON对象，在JSX的目录中可以看到空值、数字、布尔值和函数也可以是有效的子对象，而原始对象则不是。然而，您可以轻松地创建一个组件来打印任何内容，例如，无法启动状态参数作为对象？因为我认为我初始化state.scene变量的方法是不够的，但我不确定该怎么做。@Xhark如果您确实可以作为对象启动状态参数，您只需要正确地渲染这些参数，如果您想要快速解决方案，请使用

JSON.stringify（this.state.scene）