Question

我正在使用axios来获取信息，并且我需要在其他axios响应的另一个处理程序中获取该信息。我似乎无法在第二个响应处理中使用第一个响应中加载的数据。

例如：

const [firstData, setFirstData] = useState({});
const [secondData, setSecondData] = useState({});

await axios.get("url/firstRoute").then((response) => {
    setFirstData(response.data);
}).then(async () => {
    await axios.get("url/secondRoute").then((response) => {
        setSecondData(firstData); // firstData is still an empty Object here for some reason
    })
});

当我处于第二个请求中时，如何确保firstData不为空？我还尝试将useEffect钩用于firstData，并在其中调用第二个axios请求，但是我仍然得到firstData为空的相同结果。（假设两个请求都返回数据）

Answer 1

您可以像这样从第一个.then返回值：

await axios
  .get('url/firstRoute')
  .then((response) => {
    setFirstData(response.data);
    return response.data;
  })
  .then(async (firstData) => {
    await axios.get('url/secondRoute').then((response) => {
      setSecondData(firstData); // firstData is still an empty Object here for some reason
    });
  });

在您的代码中，您正在设置状态，但未在then子句之前完成。

在另一个axios请求中使用axios响应数据

1 个答案: