First response after refresh page from axios is empty

Question

This function is called up after pressing the button. Whenever the page is refreshed and the button is pressed, it is empty, the second click returns an array with correct data

  const loginUser = (e) => {
    axios.get('http://localhost:8080/user/Allusers',{
    }).then(response => {
      setUserArray(response.data)
      console.log(userExists(LoginUsername,LoginPassword)); //Check if user exist in UserArray
    }).catch(error =>{
      console.log(error);
    });
  
}

Can someone explain why array is empty on the first click? And how could I improve it

Answer 1

Because setUserArray(response.data) is asynchronous.and userExists(LoginUsername,LoginPassword) runs before.

https://reactjs.org/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous