对象作为React子对象无效如果要渲染子级集合，请改用数组

(adsbygoogle = window.adsbygoogle || []).push({}); 如何解决对象作为React子对象无效如果要渲染子级集合，请改用数组？

您的数据homes是一个数组，因此必须使用Array.prototype.map（）遍历该数组才能起作用。

return ( <div className='col'> <h1>Mi Casa</h1> <p>This is my house y&apos;all!</p> {homes.map(home => <div>{home.name}</div>)} </div> );解决方法

我正在使用Rails后端设置一个React应用程序。我收到错误消息“对象作为React子对象无效（找到：带有键{id，name，info，created_at，updated_at}的对象）。如果要渲染子代的集合，请改用数组。”

这是我的数据：

[ {'id': 1,'name': 'Home Page','info': 'This little bit of info is being loaded from a Rails API.','created_at': '2018-09-18T16:39:22.184Z','updated_at': '2018-09-18T16:39:22.184Z' }]

我的代码如下：

import React from ’react’;class Home extends React.Component { constructor(props) { super(props); this.state = { error: null,isLoaded: false,homes: [] }; } componentDidMount() { fetch(’http://localhost:3000/api/homes’) .then(res => res.json()) .then((result) => { this.setState({ isLoaded: true,homes: result });},// error handler(error) => { this.setState({ isLoaded: true,error });} ) } render() { const { error,isLoaded,homes } = this.state; if (error) { return (<div className='col'> Error: {error.message}</div> ); } else if (!isLoaded) { return (<div className='col'> Loading...</div> ); } else { return (<div className='col'> <h1>Mi Casa</h1> <p>This is my house y’all!</p> <p>Stuff: {homes}</p></div> ); } }}export default Home;

我究竟做错了什么？