Как получить API с Javascript для отображения данных? - PullRequest
0 голосов
/ 26 мая 2019

Я пытаюсь создать API с javascript для извлечения данных из этого URL для данных json: img, a, c.Но приведенные ниже коды возвращают ошибку

application.js: 10 Uncaught (в обещании) TypeError: data.forEach не является функцией

(почему forEach метод не определен) вы можете помочь?спасибо

var results = document.getElementById("results");

fetch("https://www.mangaeden.com/api/list/0/")
  .then(response => response.json())
  .then((data) => {

    data.forEach((result) => {

      const movies = '<li><img src="' + result.im + '" alt=""><h3>' + result.a + '</h3><p>' + result.c + '</p></li>';
      results.insertAdjacentHTML("beforeend", movies);

    });
  });
{
  "a": "shoujo-apocalypse-adventure",
  "c": [
    "Adventure",
    "Drama",
    "Psychological",
    "Sci-fi",
    "Seinen",
    "Slice of Life",
    "Tragedy"
  ],
  "h": 156,
  "i": "5c410d31719a16035a4647cc",
  "im": "4a/4a1f2a595e0e84e62f6ceddf3946274478928ca99e8df86bc6511b6e.png",
  "ld": 1547822837.0,
  "s": 2,
  "t": "Shoujo Apocalypse Adventure"
},

1 Ответ

0 голосов
/ 26 мая 2019

Ответом является не массив ([]), а объект ({}), и у объекта нет метода forEach.Я предполагаю, что вы хотели запустить forEach для записей, которые в этом случае находятся под data.manga.

var results = document.getElementById("results");

fetch("https://www.mangaeden.com/api/list/0/", {
    mode: 'cors'
  })
  .then(response => response.json())
  .then((data) => {

    data.manga
      .filter(movie => movie.c.includes('Action') || movie.c.includes('Adventure'))
      .slice(0, 10).forEach((result) => {

      const movies = '<li><img src="https://cdn.mangaeden.com/mangasimg/' + result.im + '" alt=""><h3>' + result.a + '</h3><p>' + result.c + '</p></li>';
      results.insertAdjacentHTML("beforeend", movies);

    });
  });
<ul id="results"></ul>

https://jsbin.com/gecusi/edit?html,js

Примечание : В примере I slice массив, потому что есть ~ 6,7kфильмы и я не хочу блокировать браузер.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...