时间戳

首页 > 解决方案 > 如何在 Ajax 同步调用后更新值

javascript - 如何在 Ajax 同步调用后更新值

问题描述

我正在从我的节点（快递）后端服务器获取数据以响应前端。但是当我尝试访问数组索引值时，我得到的输出是未定义的。我肯定在这里做错了什么。感谢有人可以帮助我。

这是我的服务器端代码：

const companyDetails = [];

companies.forEach((company) => {
    companyDetails.push(company);  
});

app.get("/api/companies", (req, res) => {
    res.json(companyDetails)
});

这是我的客户端代码：

let arr = [];

    function fetchComNames() {
        axios.get('/api/companies').then(res => {
          for(let i=0; i<=4; i++) {
              arr.push(res.data[i].name)
          }
        })
    }

    fetchComNames();

    console.log(arr[0]);   //undefined

但是当我console.log(arr);打印出数组时。我只是不能单独访问每个索引值。

这里的输出推迟

标签： javascriptnode.jsarraysreactjsexpress

解决方案

API 调用是异步的，因此您在数组中包含其值之前访问该数组。尝试将您的封闭函数标记为异步并等待 axios get 以便强制调用同步。

let arr = [];

    async function fetchComNames() {
      const fetched = await axios.get('/api/companies');
          for(let i=0; i<=4; i++) {
              arr.push(fetched.data[i].name)
          }
        
    }

    fetchComNames();

    console.log(arr[0])

推荐阅读