title: React - is there a way to set the state in a function and use the updated state right after in another function?
body: <p>I have two functions, one which creates an User Plan and another which creates an UserGoal. Inside the first function I want to set the UserPlanId in order to use it in the second function. Both these functions are called inside a handleSubmit function.</p>
  <p>However, I don't know if it is possible to make that work. I tried many things but none worked for getting the updated state inside the second function.</p>
  <pre><code>const handleSubmit = async (event) =&gt; {
  event.preventDefault();
  const resp = await axios
    .post(&quot;https://localhost:44325/UserPlans/create&quot;, {
      bmi: bmi,
      totalCalories: parseInt(totalCalories),
      totalCarbs: parseInt(carbs),
      totalProtein: parseInt(protein),
      totalFat: parseInt(fat),
    })
    .then((response) =&gt; {
      console.log(response.data);
      setUserPlan(response.data);
      setUserPlanId(response.data.id);
  
    })
    .catch((error) =&gt; {
      console.log(error.response.data);
    });
  
  await axios
    .post(&quot;https://localhost:44325/UserGoals/create&quot;, {
      Goal: goalInt,
      GoalWeight: kilosGoal,
      UserActivity: activityInt,
      UserPlanId: userPlanId, // HERE I WANT THE UPDATED STATE
    });}
  </code></pre>
  <p>Are there any options for doing this?</p>