javascriptreactjsomdbapi

30 movies per page on OMDb api in React


I am trying to combine pages to increase the items to 20, 30 since OMDb has only 10 per page. I need to get all the "imdbID" from pages 1,2 and 3.

The API shows this result:

```
"Search": [
{
"Title": "Home",
"Year": "2009",
"imdbID": "tt1014762",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BODY2ZTNmMjEtMWEyNC00YjZlLWEyMGEtZWFiNGMwYmQ5NWViXkEyXkFqcGdeQXVyMTAwMzM3NDI3._V1_SX300.jpg"
},
]


//my code

async function getRequest(){
  const pageOne = await axios
    .get('http://www.omdbapi.com/?s=${searchText}&apikey=ef773fae&page=1')
    .then(res=>res.data)
    .catch(error=>console.log(error));

  const pageTwo = await axios
      .get('http://www.omdbapi.com/?s=${searchText}&apikey=ef773fae&page=2')
      .then(res=>res.data)
      .catch(error=>console.log(error));

  const pageThree = await axios
      .get('http://www.omdbapi.com/?s=${searchText}&apikey=ef773fae&page=3')
      .then(res=>res.data)
      .catch(error=>console.log(error));

  const sumPage= {pageOne, pageTwo, pageThree};


//*not sure how to write this line of code to get all the imdbID*
  return sumPage.map(movie => movie.imdbID);
}

getRequest();

Solution

  • How about just spreading them into an array

    return {"Search":[...pageOne.Search, ...pageTwo.Search, ...pageThree.Search]};