Как я могу получить собственность внутри собственности JSON? - PullRequest
Новая
       9

Как я могу получить собственность внутри собственности JSON?

0 голосов
/ 16 января 2020

Я ПОЛУЧИЛ ЭТО JSON (НИЖЕ) 

[
  {
    id: 'dp690',
    name: 'Cubone',
    nationalPokedexNumber: 104,
    resistances: [{ type: 'Lightning', value: '-20' }]
  },
  {
    id: 'ex421',
    name: 'Bulbausaur',
    nationalPokedexNumber: 129,
    resistances: [{ type: 'Water', value: '+10' }]
  },
  {
    id: 'ml595',
    name: 'Pikachu',
    nationalPokedexNumber: 010,
    resistances: [{ type: 'Rock', value: '+1' }]
  },
]

И Я СДЕЛАЛ ЭТУ JS ФУНКЦИЮ (НИЖЕ) 

const draw = data => {
  const container = document.createElement('div');
  const f = document.createDocumentFragment();
  data.forEach(pokemon => {
    const contenedor = document.createElement('div');
    const pokedex = document.createElement('h1');
    const nombre = document.createElement('h2');
    const resistencias = document.createElement('h3');

    pokedex.textContent = pokemon.nationalPokedexNumber;
    nombre.textContent = pokemon.name;
    resistencias.textContent = pokemon.resistances.type;

    contenedor.appendChild(pokedex);
    contenedor.appendChild(nombre);
    contenedor.appendChild(resistencias);

    f.appendChild(contenedor);
  });
  d.appendChild(f);
};

ИСПОЛЬЗУЯ FETCH, Я СДЕЛАЛ ЭТО 

fetch(url)
  .then(response => {
    console.log(response);
    return response.json();
  })
  .then(response => {
    console.log(typeof response.cards);
    return draw(response.cards);
  });

И, наконец, я сделал это 

button.addEventListener('click',()=> loadpokemons())

НО Я ПОЛУЧИЛ ЭТОТ ОТВЕТ 

main.js: Uncaught (in promise) TypeError: Cannot read property 'type' of undefined
    at main.js:
    at Array.forEach (<anonymous>)
    at draw (main.js:)
    at main.js:
(anonymous) @ main.js:
draw @ main.js:
(anonymous) @ main.js:
Promise.then (async)
cargarpokemons @ main.js:
(anonymous) @ main.js:

МОЙ ВОПРОС: КАК Я ПОЛУЧИЛ СОБСТВЕННОСТЬ «pokemon.resistances.type» ?? БЕЗ ЭТОЙ ЛИНИИ 'resistencias.textContent = pokemon.resistances.type' ЭТО РАБОТАЕТ, ПОЖАЛУЙСТА, ПОМОГИТЕ!

1 Ответ

1 голос
/ 16 января 2020

Вы получаете эту ошибку, потому что pokemon.resistances.type не найден. Поскольку pokemon.resistances является массивом, вы должны сделать это следующим образом: 

const draw = (data)=>{
    const container = document.createElement('div')
    const f = document.createDocumentFragment()
    data.forEach(pokemon =>{

        const contenedor = document.createElement('div')
        const pokedex = document.createElement('h1')
        const nombre = document.createElement('h2')
        const resistencias = document.createElement('h3')

        pokedex.textContent=pokemon.nationalPokedexNumber
        nombre.textContent=pokemon.name
        if (pokemon.resistencies) {
          resistencies.textContent = pokemon.resistencies[0].type
        }

        contenedor.appendChild(pokedex)
        contenedor.appendChild(nombre)
        contenedor.appendChild(resistencias)

        f.appendChild(contenedor)
    })
    d.appendChild(f)
}

А также есть опечатка в вызове fetch на втором .then, поскольку вы не определили функцию. Вы получаете вызов должен выглядеть следующим образом: 

fetch(url)
   .then(response => { console.log(response); return response.json()})
   .then(response => {console.log(typeof(response.cards)); return 
      draw(response.cards)})
   }
...