如何确保在Fetch API中填充数组？

Question

const userfetched =[];
fetch('https://jsonplaceholder.typicode.com/users').then(response=> response.json()).then(user=>console.log(user));
console.log('end')

这里输出空数组。

但如果我使用以下代码：

dynamic_cast

输出 结束 那么数组值。

我如何等待获取响应被填充并迭代它？

Answer 1

在获取承诺解析并解析为json：

后，将console.log(userfetched)放入

fetch('https://jsonplaceholder.typicode.com/users')
  .then(response => response.json())
  .then(user => { 
      console.log(user) 
      // and do whatever you wanna do here
  });

Answer 2

完成该功能后调用callApi函数并将响应推送到阵列并控制结果

将异步更改用于同步

const userfetched = [];
class App extends Component {

     async callApi() {
       var res = await fetch('https://jsonplaceholder.typicode.com/users')
       var result = await res.json()
       console.log(JSON.stringify(result))
     }

      componentDidMount() {
        this.callApi()
      }

   render{
        return( //do something.... )
   }
}