Question

我想使用SWAPI（https://swapi.co/）来获取数据，我已经在下面的代码中创建了该代码，但是我担心我使用了太多的获取-该体系结构是错误的。

计划是：首先获取基本数据（从中创建按钮），然后单击按钮并从另一个URL获取数据并显示它们（显示链接时，也将它们更改为按钮）

我已经创建了按钮并获取数据（现在console.log个按钮）

//get the base list of attributes
let mainContent = document.getElementById('mainContent'); // div with id=mainContent
let mainList = new Map();
let mainUrl = fetch('https://swapi.co/api/'); //base URL

mainUrl
  .then(response => response.json())
  .then(list => {
    for (let main in list) {
      mainList.set(main, list[main]);
    }
    mainList.forEach((value, key) => {
      createButton(value, key);
    });
  })
  .catch(err => console.error('Caught error: ', err));

let createButton = (value, key) => {
  let button = document.createElement('button');
  button.setAttribute('name', key);
  button.setAttribute('value', value);
  button.innerHTML = key;
  button.addEventListener('click', e => {
    console.log(e.target.value);
    return fetch(e.target.value)
      .then(response => response.json())
      .then(resp => {
         console.log(resp.results);
      });
  });
  mainContent.appendChild(button);
};

我希望从点击的网址中列出其他人，但是我希望使用更少的抓取方式

单击按钮后如何获取数据并限制获取次数

0 个答案: