0

Im hitting two different endpoints and I am trying to extract the img value which returns a promise, I am trying to obtain the promise result as a string and assign it to the image value in the map function.

This is what I am getting as returned

Here is the code which is returning the promise

async function loadPlacesWithImages() {
   const getImage = async (placeId) => {
       const request = await fetch("https://byteboard.dev/api/data/img/" + placeId);

       const data = await request.json();

       return data.img;
   };


   const getListing = async (api) => {
    const request = await fetch(api);
    const data = await request.json();
    let newArr = data.places.map((element) => ({
    id: element.id,
    name: element.name,
    address: element.address,
    stars: element.stars,
    reviews: element.reviews,
    price: element.price,
    description: element.description,
    img: getImage(element.id),
    }));
    console.log(newArr);
   };
}

To assign the img value I need it in a string but the promise returns a object as shown in the picture, so how would I get the result of the promise based on my code.

Ismail Ghelle
  • 1
  • 2
    You forgot to `await` `getImage`. – jonrsharpe Feb 24 '21 at 09:55
  • Where/how is `getListing` used? But @jonrsharpe's point above is likely the solution. – T.J. Crowder Feb 24 '21 at 09:57
  • Beware that you're not checking for HTTP failure before calling the `json()` method on what you're getting back from `fetch`; more in [my blog post here](http://blog.niftysnippets.org/2018/06/common-fetch-errors.html). Side note: What you get from `await fetch(...)` is a *response*, not a *request*. – T.J. Crowder Feb 24 '21 at 09:58
  • @T.J.Crowder getListing is just called getListing(api) right after – Ismail Ghelle Feb 24 '21 at 09:58
  • @jonrsharpe how would i await getImage its called in the map() function ? – Ismail Ghelle Feb 24 '21 at 10:07
  • Ah, due to the inconsistent indentation it wasn't clear that was in a map function. Note you can resolve an array of promises with `Promise.all`. – jonrsharpe Feb 24 '21 at 10:31

0 Answers0