how to access value of object using useState hook in reack

Question

This is api of movie which contain movie as key and movies detail as object Now I have get the values of movie in useState but I not able to figure out how exactly I can get the details

{ 
"movies": [
{
        "Name":"The Forever Purge",
        "releasedate":"27 aug 2012",
        "id": 1,
        "genre" :"Action/Horror/Thriller", 
        "imageUrl": "https://drive.google.com/file/d/1sisX7wQf6owcj3qys413l471bNu5iM0T/view? 
                     usp=sharing"
    },
    {
        "Name":"Reminiscence",
        "releasedate":"27 aug 2012",
        "id": 2,
        "genre" :"Mystery/Romantic/Sci-Fi", 
         "imageUrl": "https://drive.google.com/file/d/1GBzbZ6VC243-1kg4EsaYwq6Qm9fLDdJb/view? 
                      usp=sharing"
    }
]
}

this is currently I am writing in code But this is not getting we the details of movie


const [moviesList, setMoviesList] = useState({});

  const getMovies = async () => {
    const response = await fetch(
      "https://run.mocky.io/v3/55492543-1c03-4b5e-8ff4-28bbd2638780"
    );
    var data= await response.json();
    setMoviesList(data);
    // console.log("hiii");
  };

  useEffect =(() => {
      getMovies();
    },
    []);

so can any one please help me

Are you trying to .map your moviesList.movies and it does not get displayed or are you trying console.log your moviesList right after you set your state? — Enes Toraman, Jul 16 '22 at 08:04

score 0 · Answer 1 · answered Jul 16 '22 at 07:59

Since you are running getMovies for one time, it is better for you to define that function inside useEffect and call it there:

useEffect(() => {
  const getMovies = async () => {
    const response = await fetch('...');
    const data = await response.json();
    setMovieList(data);
  }
  getMovies();
}, []);

This is what recommended by official documentation, for more information:

https://reactjs.org/docs/hooks-faq.html#how-can-i-do-data-fetching-with-hooks

https://www.robinwieruch.de/react-hooks-fetch-data/

how to access value of object using useState hook in reack

1 Answers1