score:1

Accepted answer
post = this.state.posts.map(function (item, key) {
            return <Post title={item.title} content={item.content} key={key}/>
       })

Your state.posts is an array and you should map over it.

score:1

post = Object.keys(this.state.posts).map((item, key) => {
    return (
        <Post 
            title={this.state.posts[item].title}
            content={this.state.posts[item].content} 
        />
    )
})

as Subin says, what you need to do in that case is just map over the posts array.

But, to fix your code is very simple. just use arrow function instead of a regular function.

score:1

Do it like this:

post = this.state.posts.map(post => {
  return <Post title={post.title} content={post.content} key={post.title}/>
})

When you map over array, you dont need to acces that state again, because post will be assigned to post inside map function. And then just acces title and content. and dont forget to pass key,there i've passed key={post.title} but that is not a good solution, because it needs to be unique.


Related Query

More Query from same tag