ForEach - отображать результаты из API - PullRequest
Новая
       39

ForEach - отображать результаты из API

0 голосов
/ 11 марта 2019

Возникли проблемы при попытке получить доступ к значению title в этом массиве объектов.

Это giphy api, и вы можете видеть ниже, я использую fetch для вызова api. И цикл через данные, используя forEach.

Я могу назвать API и консольный журнал массивом, содержащим 5 объектов. Однако я не думаю, что правильно сопоставляю свои данные.

Например, когда я console.log console.log('foreach', elem);, я возвращаю в консоли следующее: 

foreach 0
foreach 1
foreach 2
foreach 3
foreach 4

Однако, когда я console.log('foreach', elem.title);, мне возвращается undefined. По сути, я не могу получить доступ к каким-либо данным в объекте, поскольку мне все время возвращают неопределенное значение.

Вот мой код: 

 fetch('http://api.giphy.com/v1/gifs/search?q=ryan+gosling&api_key=MY_API_KEY&limit=5')
    .then((res) => {
      return res.json();

    })
    .then((data) => {
      console.log(data.data);    
      // This returns a full array object of data

      let result = '<h2> Random User Info From Jsonplaceholder API</h2>';

      Object.keys(data.data).forEach(elem => {
        console.log('foreach', elem);


        result +=
                `<div>
                 <h5> User ID: ${elem} </h5>

                  </div>`;
        place.innerHTML = result;
      });
    });

В принципе, я думаю, что что-то не так в моем ForEach.

1 Ответ

0 голосов
/ 11 марта 2019

Вы сказали, что ваш data - это массив объектов. Если вы будете использовать Object.key() на array. Он вернет индексы array, т.е. 0,1,2,3.... Вам нужно вызвать forEach() непосредственно в массиве 

data.data.forEach(elem => {
        console.log('foreach', elem);
});

Для доступа к свойству предмета используйте Точечная запись 

data.data.forEach(elem => {
       console.log('foreach', elem.title);
});
...