Reactjs '；this.props.tasks.map不是函数'；错误反应错误

将数组传递给组件时，我收到错误-“this.props.tasks.map不是函数”

我的Main.js代码

let posts = [
    {
        id: 1,
        description: "This is a task",
        status: "pending"
    },
    {
        id: 2,
        description: "This is another task",
        status: "pending"
    },
    {
        id: 3,
        description: "This is an easy task",
        status: "pending"

    }
];



class Main extends Component {
    render() {
        return <div>
            <Title title="Photowall" />
            <Photowall posts={ posts } />

        </div>
    }
}

let posts=[
{
id:1，
描述：“这是一项任务”，
状态：“待定”
},
{
id:2，
描述：“这是另一项任务”，
状态：“待定”
},
{
id:3，
描述：“这是一项简单的任务”，
状态：“待定”
}
];
类主扩展组件{
render（）{
返回
}
}

以及Photowall.js代码

 render() {
        return <div>
            {this.props.posts.map((item) => <Photo key={item} post={item}/>)}
             </div>

    }

render（）{
返回
{this.props.posts.map（（项）=>）}
}

我想你是想写

<Photowall posts={ posts } />

---

实际上，您通过传递

posts={{{posts}}

来传递数组的

对象

只通过这个,

<Photowall posts={ posts } />



你必须通过
帖子
如下

<Photowall posts={posts} />

照片

class Photo extends Component { 
   render() { 
        const data = this.props.post; 
        return <p>{data.description}</p> 
    } 
}

这就是为什么这不起作用

希望这对你有用
 传递此消息时，我得到“对象作为React子对象无效（找到：具有键{Components}的对象）。如果要呈现子对象集合，请使用数组。”errorPost yur
Photo
component。在
Photo
组件中，您可能正在打印object.class Photo扩展组件{render（）{const data=this.props.item return{data.description}
}。这是错误的
data=this.props.item
，它应该是
data=this.props.post
。检查演示链接。在传递此链接时，我得到“对象作为React子对象无效（找到：具有键{Components}的对象）。如果要渲染子对象集合，请使用数组。”错误您必须像这样更新渲染代码<代码>{this.props.posts.map（（项）=>）}

。让我知道这对你有用吗？我已经更新了我的答案。如果不行，请告诉我。

class Photo extends Component { 
   render() { 
        const data = this.props.post; 
        return <p>{data.description}</p> 
    } 
}

{
   posts: [
    {
        id: 1,
        description: "This is a task",
        status: "pending"
    },
    {
        id: 2,
        description: "This is another task",
        status: "pending"
    },
    {
        id: 3,
        description: "This is an easy task",
        status: "pending"

    }
]
}