How to use map() with data from axios response? How to use map() with data from axios response? reactjs reactjs

How to use map() with data from axios response?


{    posts.map( post => {    return <Post title={post.title} />}) }

Maybe it works.


You can provide callback to setState method which will run after the state is updated. You can use

this.setState({posts: data, isLoading: false}, () => console.log(this.state.posts))

to log updated state.

And in render method you should use

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

or

 render() {  const { posts} = this.state;   return(      <React.Fragment>       posts.map( (post,i) => (        <Post title={post.title} key={i} />       ))       </React.Fragment>   ) }


Can you try this:

async componentDidMount() {             const { data } = await axios.get('/api/all')        this.setState({posts: data, isLoading: false}, () => {        console.log(this.state.posts)        return;    })      }