Javascript 创建将更新状态的axios调用，然后执行另一个调用

我这里有个谜。我正在尝试基于单击一个按钮执行两个HTTP Axios调用。基本上第一个会给我带来正确的代币。我想更新组件的初始状态，然后用更新后的状态推送第二个调用。但是，第二次呼叫似乎并不等待第一次呼叫完成，这就是为什么我的状态没有更新，我不能显示任何内容。有人能帮我一下吗。我将在这里留下一个代码示例：

const [useFetchedToken, setUseFetchedToken] = useState();
const [useFetchedCustomerFromToken, setUseFetchedCustomerFromToken] = useState();

...

  const fetchData = async () => {
     const firstBody= {
           url,
           customer
        };

  const firstHeader = {
         headers: {
         'Content-Type': 'application/json;charset=UTF-8',
         'Access-Control-Allow-Origin': '*',
         'Authorization': 'Bearer ' + token
           }
          };

   const firstUrl = serverUrl + '/api/view/customer'

   const secondBody = {
          url,
          customer : useFetchedCustomerFromToken,
          startDate,
          endDate
                };

     const secondHeader = {
             headers: {
             'Content-Type': 'application/json;charset=UTF-8',
             'Access-Control-Allow-Origin': '*',
             'Authorization': 'Bearer ' + useFetchedToken
                    }
                };

    const secondUrl= serverUrl + '/api/view/user/invoices'

try {
  const myFirstCall = await axios.post(firstUrl , firstBody, firstHeader)

                    const tokenFromResponse = response.data.token

                    setUseFetchedToken(tokenFromResponse)

                    setUseFetchedCustomerFromToken(jwt_decode(response).customer)

const mySecondCall = await axios.post(secondUrl, secondBody, secondHeader)
...
  }

---

我看到状态得到了更新，但我担心无论它得到了更新，都会执行调用，并且没有插入正确的数据。有几件事，但我将首先解决这个问题

您的状态不会立即更新，因此您不能使用

设置状态

功能，然后立即访问

状态

，因为它尚未更新。它将在后续渲染中处于当前状态。因此，您需要直接使用第一次调用的值，而不是通过state。所以

const mySecondCall = await axios.post(secondUrl, secondBody, secondHeader)

一定是

const mySecondCall = await axios.post(secondUrl, 
{
    url,
    // use value, not state
    customer : jwt_decode(response).customer,
    startDate,
    endDate
}, 
{
    headers: {
        'Content-Type': 'application/json;charset=UTF-8',
        'Access-Control-Allow-Origin': '*',
        // use value, not state
        'Authorization': 'Bearer ' + tokenFromResponse
    }
})

然后你可以像在这之后那样设置你的状态

---

另一件事是你的州命名约定

use

建议仅用于命名挂钩，因此不要执行

const[useSomeState，setUseSomeState]=useState（“”）

好的，我明白你的意思，但是现在单击按钮时只执行了一次调用，这就是

myFirstCall

是否发生了第二次post？它是否因错误而失败？是的，第一次调用已触发，我收到了一个带有新令牌的响应。我在控制台中看到的消息是

InvalidTokenError{message:“指定的无效令牌”}message:“指定的无效令牌”

@PandaMastr好的，因此调用了代码，但传递的令牌/数据有问题。仔细检查我的密码。我给你的是大概的想法，应该很接近。但我不能实际运行它来测试它。这就是你进来的地方。：）我想顺便说一句，它不接受头和主体，这就是它不执行调用的原因，因为我用硬编码值尝试了一下，我看到调用已经执行了