当 fetch async 加载我的数据时，如何在 Javascript 中添加微调器？

Question

早上好，我的 js 文件中有一个 fetch 异步函数，用于将 ajax 成员调用到政府表中。我想在加载数据时添加一个微调器，并且我想在微调器（ajax）工作时隐藏表格标题和下拉菜单以及复选框。我没有使用任何框架，只是使用 js vanilla。我是一名学生，我不能使用 jquery 来做到这一点。我有旋转器，但当数据出现在表格上时它不会消失。太感谢了！

async function getData(chamber) {
  members = await fetch(`https://api.propublica.org/congress/v1/113/${chamber}/members.json`, {
      method: "GET",
      headers: new Headers({
        'X-API-Key': 'iv8LMc9T9sQKOc0EfDC1NLtQU68pFsF6O6W3NPJz'
      })
    })

    .then(response => response.json())
    .then(data => data.results[0].members)
    .catch(err => console.log(err))
  webLogic(chamber);
  document.getElementsById("loader").style.display = "none"
}

Answer 1

您可以通过设置innerHTML元素来实现这一点 - 请注意，setTimeout此处仅用于“模拟”您的异步请求。当然你需要类似的东西

.then((resolvedData) => document.getElementById('myDiv').innerHTML = resolvedData)

这是片段：

.then((resolvedData) => document.getElementById('myDiv').innerHTML = resolvedData)

document.getElementById('load').addEventListener('click', function () {
  document.getElementById('content').innerHTML = '...'
  setTimeout(function () {
    document.getElementById('content').innerHTML = 'content loaded!'
  }, 2000)
})