首页 > 解决方案 > 将未定义的数据从第三方 api 发布到我的 mongodb 地图集

问题描述

我有一个从第三方 API 获取的口袋妖怪列表。我正在尝试通过从第三方 api 中选择口袋妖怪来创建您创建的收藏夹列表。因此,当我单击添加按钮时,它应该转到我的数据库,但是我得到了一个新对象,但内容未定义。任何帮助,将不胜感激。

function createPokemonCard(data) {
  const pokeContainer = document.getElementById("poke-container");
  const pokemonEl = document.createElement('div');
  pokemonEl.classList.add('pokemon');
  const pokeInnerHtml = `
<div class="img-container">
<img src="${data.sprites.front_default}">
</div>
<div class="pokeCard">
<h1 id="id">${data.id}</h1>
<h3 id="name">${data.name}</h3>
<h4 id="type">${data.types.map(type => type.type.name).join(", ")}</h4>
<button onclick="addFavourite()">Add</button>
</div>
`;
  pokemonEl.innerHTML = pokeInnerHtml;
  pokeContainer.appendChild(pokemonEl);
}

async function addFavourite() {
  let name = document.getElementById('name').value ;
  console.log(name);
  let type = document.getElementById('type').value ;
  
  let data = {
      "name": name,
      "type": type
  }
  await fetch('https://web2-course-project-api-somrad.herokuapp.com/api/pokemons', {
      method: "POST",
      mode: 'cors',
      headers: {
          'Content-type': 'application/json; charset=utf-8'
      },
      body: JSON.stringify(data)
  });

pokemonRouter.route('/pokemons')
//POST YOUR FAVOURITE POKEMON
  .post((req, res)=>{
    const collection = db.collection("pokedex");
    collection.insertOne(req.body).then(
      () => {
        res.status(200).json({
          message: 'Added!'
        });
      }
    ).catch(
      (error) => {
        res.status(400).json({
          error: error
        });
      });
  })

标签: javascripthtmlnode.jsmongodb

解决方案


推荐阅读