Search code examples
reactjsuse-state

How to Display API data stored in state


Am new to react and am tying to display data from an API but can't figure out where am going wrong.

const [all,setAll]=React.useState([])

React.useEffect(()=>{ 
        fetch('https://api.themoviedb.org/3/trending/all/day?api_key=<key>')
        .then(data=>{
           return data.json()
        }).then(completedata=>{
            
            setAll(completedata.results)
           
        })
        
    },[])

    return(
        <div id="movie-card">
            <img src={all.poster_path} alt={all.original_title}/>
            <h3>{all.original_title}</h3>
            <span> Ratings:{all.vote_average}</span>
            <h4>{all.release_date}</h4>
        </div>
    )
 }

Solution

  • I should have mapped through the 'all' array here inorder to to display each individual object results